MVC + 在列表框中传递选定的值答案

【问题标题】：MVC + Pass unselected values in listboxMVC + 在列表框中传递选定的值
【发布时间】：2026-01-21 08:15:02
【问题描述】：

所以我有 2 个简单的选择框控件（MVC 中的 @Html.ListBoxFor），

我允许用户从左侧选择框中选择并将所选项目向右移动，这很好用（参见我的示例：http://jsfiddle.net/tekguy/NJGzu/）

但是如何将正确列表框中的所有内容传递给 MVC？

如果用户不小心点击了右侧框中的一项，就会出现问题，其他所有内容都未选中，并且这将是唯一传回控制器的值。

关于如何解决这个问题的任何想法？我正在考虑使用 javascript 在表单发布的正确文本框中选择所有内容。但是还有其他方法可以解决这个问题吗？

HTML 代码：

<select id="list1" multiple>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

<input type="button" value=">>" id="moveRight" />
<input type="button" value="<<" id="moveLeft" />

<select id="list2" multiple>
    <option value="4">Option 4</option>
</select>

JAVA 脚本代码：

$( function() {
    $('#moveRight').click(function(){
        $('#list1 option:selected').each(function(){
            $(this).remove().appendTo("#list2");
        });
    });

    $('#moveLeft').click(function(){
        $('#list2 option:selected').each(function(){
            $(this).remove().appendTo("#list1");
        });
    });
});

【问题讨论】：

标签： jquery asp.net-mvc-3

【解决方案1】：

不久前，我在一个项目中需要类似的东西。我发现只有选择的项目被退回。我按照你的建议使用了javascript。像这样的东西对我有用。

$("#MassUpdateForm").submit(function() {
    $("#select_right").children("option").each(function() {
        this.selected = true;
    });
});

【讨论】：

【解决方案2】：

你不需要循环来追加元素。一个特定的元素只能在 dom 中存在一次。所以除非你克隆和追加。没有必要先删除该元素。然后，您可以在表单的提交事件中将所有选项更改为选中

$(function () {
  $('#moveRight').click(function () {
    $('#list1 option:selected').appendTo("#list2"); // this will move all selected options to right side
  });
  $('#moveLeft').click(function () {
    $('#list2 option:selected').appendTo("#list1"); // this will move all selected options to left side
  });
  $('yourform').on('submit', function () {
    $('#list2 option').prop('selected', true); // set all options on right side to selected
  });
});

【讨论】：