添加/删除选择框不提供值[关闭]

Question

（问题在这篇文章的底部）

您好，我正在关注本教程 。

我总共制作了3个框，其中1个包含所有值，另2个用于分隔值。

就像这张图片所示：

这是我的Jquery：

<script type="text/javascript">
        $(document).ready(function() {
        $("#and").click(function() {
            $("#totalselect option:selected").each(function() {
            $("#select-and").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
            $(this).remove();
            });
        });
        $("#removeand").click(function() {
            $("#select-and option:selected").each(function() {
            $("#totalselect").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
            $(this).remove();
            });
        });
        $("#or").click(function() {
            $("#totalselect option:selected").each(function() {
            $("#select-or").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
            $(this).remove();
            });
        });
        $("#removeor").click(function() {
            $("#select-or option:selected").each(function() {
            $("#totalselect").append("<option value='" + $(this).val() + "'>" + $(this).text() + "</option>");
            $(this).remove();
            });
        });
        });
    </script>

这是我的HTML：

<div id="mass_options">
        <a href="JavaScript:void(0);" id="and">And</a>
        <a href="JavaScript:void(0);" id="or">Or</a>
        <select name="totalselect[]" id="totalselect" multiple size="5">
            <?php foreach ($reasons as $r) { ?>
                <option value="reason_<?php echo $r['reason_id'] ?>">Reason: <?php echo $r['reason'] ?></option>
            <?php } ?>
            <?php foreach ($options5 as $key => $value) { ?>
                <option value="status_<?php echo $key ?>">Session Status: <?php echo $value ?></option>
            <?php } ?>
            <?php foreach ($info as $key => $value) { ?>
                <option value="action_<?php echo $key ?>">Action: <?php echo $value ?></option>
            <?php } ?>
        </select>
        </div>

        <select name="and" id="select-and" multiple size="5" class="selectnew">
        </select>
        <select name="or" id="select-or" multiple size="5" class="selectnew">
        </select>
        <br>
        <br>
        <a href="JavaScript:void(0);" id="removeand">Remove And</a>
        <a href="JavaScript:void(0);" id="removeor">Remove Or</a>

问题

当我单击“下一步”时，它会将我发送到仅对所有发布值执行var_dump的页面，我注意到的是我添加到“和框”或“或框”中的值都不在var_dump中。 我可以将其提交的唯一方法（当我单击下一步时）实际上是在“和框”或“或框”中突出显示该值。 如果它是在“和”或“或”框中自动选择的，那么我如何才能提交给我的脚本而不必突出显示它们呢？

我这样做的原因是，我可以动态地构建查询，而where子句为“ AND”或“ OR”，这样我可以使给学生发送电子邮件的过程更加动态，而不仅仅是剪切和干燥。

任何帮助都会很棒。

Answer 1

以本机格式提交，您必须“突出显示”您的选择。 您知道在帖子中只会发送选定的选项。 您可以在发送数据之前使用jQuery选择它们：

$("form *:submit").click(function() { /* choose a better selector for submit button */
    $("#select-and options, #select-or options").attr("selected", true);
    $(this).parents("form:first").submit();
});

没有“自动选择”的另一种选择是使用AJAX发送帖子。 这样，您就可以准备发送数据。

..或将您的jQuery编辑为：

<script type="text/javascript">
    $(document).ready(function() {
        $("#and").click(function() {
            $("#totalselect option:selected").appendTo("#select-and");
        });
        $("#or").click(function() {
            $("#totalselect option:selected").appendTo("#select-or");
        });
        $("#removeand").click(function() {
            $("#select-and option:selected")
                .removeAttr("selected")
                .appendTo("#totalselect");
        });
        $("#removeor").click(function() {
            $("#select-or option:selected")
                .removeAttr("selected")
                .appendTo("#totalselect");
        });
    });
    </script>