1

我有一个表单，用户需要从 3 个非常长的列表中选择多个项目，这些列表将动态生成。我的解决方案是将 3 个列表放在带有可过滤列表视图和复选框的单独弹出窗口中。它在视觉上工作并且交互很好，但是弹出窗口内的复选框的值似乎在提交时丢失了，因为我没有从 $_POST 得到任何复选框字段名称的返回值。

形式：

<form action="processor.php" method="post">
<label for="Title" class="ui-hidden-accessible" >Title:</label>
<input name="Title" id="Title" value="" placeholder="Title"  type="text">

<label for="Desc" class="ui-hidden-accessible" >Battle Round Description:</label>
<textarea  name="Desc" id="Desc" value="" placeholder="Description (Optional)" ></textarea>

<a href="#AddVol_Pop" data-rel="popup" data-position-to="window" data-role="button" data-transition="pop" >Assign Volunteer(s)</a>
<a href="#AddJudge_Pop" data-rel="popup" data-position-to="window" data-role="button" data-transition="pop" >Assign Judge(s)</a>

<!-- Pop Ups -->
<!-- Volunteers -->
<div data-role="popup" id="AddVol_Pop" data-overlay-theme="a" data-theme="a" style="max-width:500px">
    <div data-role="header" >
        <h1>Assign Volunteer(s)</h1>
    </div>
    <div data-role="content" data-theme="a">
        <fieldset data-role="controlgroup">
        <ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search volunteers..." data-inset="true" data-theme="a">

            <?php
                $volSet = get_all_users_by_roles(1,2,3,4);
                while($row = mysql_fetch_array($volSet)){
                    echo "<li style=\"padding:0px;\">";
                    echo "<label for=\"selectVol{$row[UserID]}\">{$row[UserFirstName]} {$row[UserLastName]}</label>";
                    echo "<input name=\"selectVol[]\" value=\"{$row[UserID]}\" id=\"selectVol{$row[UserID]}\" type=\"checkbox\">";
                    echo "</li>";
                }
            ?>

        </ul>
        </fieldset>

        <a href="#" data-role="button" data-inline="true" data-rel="back" >Done</a>
        <a href="#" data-role="button" data-inline="true" data-rel="back" >Clear</a>
    </div>
</div>
<!-- End Volunteers -->

<!-- Judges -->
<div data-role="popup" id="AddJudge_Pop" data-overlay-theme="a" data-theme="a" style="max-width:500px">
    <div data-role="header" >
        <h1>Assign Judge(s)</h1>
    </div>
    <div data-role="content" data-theme="a">
        <fieldset data-role="controlgroup">
        <ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search judges..." data-inset="true" data-theme="a">

            <?php
                $judgeSet = get_all_users_by_roles(5);
                while($row = mysql_fetch_array($judgeSet)){
                    echo "<li style=\"padding:0px;\">";
                    echo "<label for=\"selectJudge{$row[UserID]}\">{$row[UserFirstName]} {$row[UserLastName]}</label>";
                    echo "<input name=\"selectJudge[]\" value=\"selectJudge{$row[UserID]}\" id=\"selectJudge{$row[UserID]}\" type=\"checkbox\">";
                    echo "</li>";
                }
            ?>

        </ul>
        </fieldset>

        <a href="#" data-role="button" data-inline="true" data-rel="back" >Done</a>
        <a href="#" data-role="button" data-inline="true" data-rel="back" >Clear</a>
    </div>
</div>
<!-- End Judges -->

<div class="row">
    <div class="large-6 columns">
        <button type="submit" name="submitNewRound"  data-icon="check">Create Round</button>
    </div>
    <div class="large-6 columns">
        <a href="rounds.php" type="button"  data-icon="back"  >Cancel</a>
    </div>
</div>

处理器：

<?php
if (isset($_POST['submitNewRound'])) {
    $Title = trim(mysql_prep($_POST['Title']));
    $Desc = trim(mysql_prep($_POST['Desc']));

    $sql = "INSERT INTO Round (
                RndTitle,
                RndDesc
            ) VALUES (
                '{$Title}',
                '{$Desc}'
            )";

    $message = "Results: ";

    if (mysql_query($sql, $connection)){
        $genRnd = mysql_insert_id();
        $message .= "Round created sucessfully.";               
    } else {
        $message .= "Creating new Round failed: ";
        $message .= mysql_error(); 
    }

    foreach($_POST['selectVol'] as $volID){
        $sql = "INSERT INTO Round_User (
                    UserID,
                    RndID
                ) VALUES (
                    '{$volID}',
                    '{$genRnd}'
                )";

        if (!mysql_query($sql, $connection)){
            $message .= "Inserting RUser for VolID Failed: ";
            $message .= mysql_error();
        }
    }

    foreach($_POST['selectJudge'] as $judgeID){
        $sql = "INSERT INTO Round_User (
                    UserID,
                    RndID
                ) VALUES (
                    '{$judgeID}',
                    '{$genRnd}'
                )";

        if (!mysql_query($sql, $connection)){
            $message .= "Inserting RUser for JudgeID Failed: ";
            $message .= mysql_error();
        }
    }

} 
?>

我相信错误在于弹出窗口，因为表单中的其他所有内容都可以正常返回。如何确保在这些弹出窗口中所做的选择保留为整体表单的一部分？

4

1 回答 1

2

我有类似的反应，试图做一个带有隐藏字段的表单，以便在弹出窗口中显示。我发现 jquery 会自动将这些输入字段移动到页面底部，并且只在标签中插入占位符。我现在正在干预一些不同的解决方案，如果我想出任何适合我们俩的解决方案，我一定会分享。

**编辑：这是我发现的与该问题相关的更多信息：http: //forum.jquery.com/topic/jquery-mobile-popup-aspires-outside-of-form

到目前为止，我们的困境看起来很严峻。我开始认为在这种情况下使用 twitter 引导弹出窗口可能会更容易，甚至只是构建我自己的。

于 2013-05-12T05:19:56.833 回答