如何创建一个空的列表框并传递选项而不选择它们？

Question

在我的表单中，我将类别从一个列表框移动到另一个列表框，如下所示：

底部框是“input”框，在发布表单时在服务器端读取。以下是我创建列表框的方法：

<%: Html.ListBoxFor(m => m.categories, Model.categories)%>

我在这里遇到两个问题：

1. 在 Firefox 中，首次加载表单时，底部框始终具有默认<option></option>。是否可以在服务器端删除它？ IE 似乎创建了一个空框但不是FF 为了解决这个问题，我正在删除页面加载时的空选项。这样做的一个问题是，当表单出现错误但未提交时，会再次删除选项。

2. 为了发布底部框中的选项，必须选择它们。为了解决这个问题，我使用下面的jQuery来选择表单上的选项。

---

jQuery选择提交选项：

$("form").submit(function (event) {
    $("#categories").find("option").attr('selected', 'selected');  
});

jQuery删除加载选项：

$("#categories").find("option").remove();

问题
1.我可以创建一个适用于所有浏览器的空列表框吗？ 2.我是否必须选择底部框中的选项或是否有解决方法？

Clarifiation：我希望尽可能多地在服务器端完成，最好是与MVC相关的东西。

Answer 1

1。 http://jsfiddle.net/wVWGm/检查空列表框的浏览器兼容性。

2

$("form").submit(function (event) {
    $("#categories").find("option:selected");  
});

Answer 2

Firefox具有这样的特性，需要它来创建空白元素才能实际显示select元素。我担心你无法解决这个问题。但是，＃2的潜在解决方法可能会消除您对＃1的担忧。

如果您在添加和删除按钮上构建jQuery单击事件处理程序，以创建和销毁具有相同名称属性的隐藏输入，以便在框之间可视地移动每个值，它们将作为CSV字符串到达​​相应的成员Request.Form集合，可以通过调用：

将其转换为值数组

Request.Form("myHiddenInputName").Split({","c})

或等效的C＃代码。您无需在提交时选择元素，也无需担心清除Firefox在服务器端创建的空值。当然......这可能不是MVC架构中最吸引人的解决方法，但这是我的第一个回复，所以我想我会分享。

Answer 3

1：不要删除所有选项，只需删除空选项，这样就不会重置。

$('#mySelect option').each(function () {
    if(!$(this).val())
        $(this).remove();
});

http://jsfiddle.net/yWHLW/5/

Answer 4

为什么不使用简单的HTML创建列表框;而不是使用帮助

<select style="width: 370px;" class="cmbBox1" id="ServicesList" 
multiple="multiple" name="ServicesList" size="8"></select>