在提交表单之前选择多选中的所有选项答案

【问题标题】：Select all options in multiple select before submitting form在提交表单之前选择多选中的所有选项
【发布时间】：2016-04-28 17:43:37
【问题描述】：

我创建了一个带有两个 html 多项选择的小部件 - “可用”和“已选择”。用户从“可用”中选择项目，它们显示在“已选择”中，非常简单的东西。我只对“选定”值感兴趣（另一个根本没有名称属性），但它发送所有必须选择的值。

我试图在 jQuery“提交”事件中选择它们，但由于某种原因它不起作用。我可以看到它们都是在发送表单之前被视觉选择的，但数据本身并没有发送。

        var form = this.$selectedSelect[0].form;
        $(form).on('submit', function(e) {
            this.$selectedSelect.find("option").prop("selected", true);
        }.bind(this));

我想避免为每个“选定”条目创建隐藏字段。

【问题讨论】：

标签： javascript jquery html forms

【解决方案1】：

您应该阻止原始提交过程并在选择所有项目后调用一个新的，如下所示：

var form = this.$selectedSelect[0].form;
    $(form).submit(function(e) {
        e.preventDefault();
        this.$selectedSelect.find("option").prop("selected", true);
        this.submit();
    });

更新：

您甚至不需要阻止默认行为，以下简单的解决方案已经足够了：

 var form = this.$selectedSelect[0].form;
 $(form).submit(function(e) {
    this.$selectedSelect.find("option").prop("selected", true);
 });

【讨论】：

不幸的是它不起作用（即使使用 preventdefault），就像我说的我可以看到被选择的元素，但只有原来的选择（在通过代码选择之前）被发送跨度>
@kasztelan 你试过用.attr()代替.prop()吗？
@kasztelan 我使用我的代码构建了一个工作小提琴：jsfiddle.net/xqnhyxhz 您需要提供更多代码以提供更多帮助...

【解决方案2】：

你需要这样的东西

<script>
    $(document).ready(function() {
        $("form").on("submit",function(eve){
            eve.preventDefault();
            $("select#someSelectId").find("option").prop("selected", true);
            $(this).submit();
        })
    })
</script>

【讨论】：

请看我对其他答案的评论