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

Question

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

下面的框是“输入”框，在发送表单时在服务器端读取。下面是我如何创建列表框：

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

我这里有两个问题：

1. In Firefox，当第一次加载表单时，底部的框总是有默认的<option></option>。在服务器端可以删除吗？IE似乎创建了一个空框，但没有创建FF。

为了解决这个问题，我删除了页面加载上的空选项。这方面的一个问题是，当表单出现错误且未提交时，将再次删除这些选项。

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

上的选项

选择提交选项的jQuery：

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

jQuery在加载时删除选项：

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

问题

1. 可以创建一个在所有浏览器中都能工作的空列表框吗？
2. ，我必须选择底部框中的选项还是有解决办法？

Clarifiation:我希望尽可能多地在服务器端完成，最好是使用一些与MVC相关的内容。

Answer 1

他说:不是删除所有选项，而是删除空选项，这样就不会重置。

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

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

Answer 2

1. http://jsfiddle.net/wVWGm/检查空列表框.

的浏览器兼容性。

2

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

Answer 3

Firefox有一个特性，要求它创建空白元素，以便实际显示select元素。恐怕你不能解决这个问题。然而，第二种可能的解决办法可能会消除你对#1的担忧。

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

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

或等效的C#代码。您不需要选择submit上的元素，也不需要担心清除Firefox在服务器端创建的空值。当然..。在MVC架构中，这可能不是最吸引人的解决方案，但这是我的第一次响应，所以我想我应该分享。