DropDown（组合框）与ASP.NET MVC中的复选框

Question

嗨，

我正在构建一个ASP.NET MVC 2应用程序，到目前为止使用常规下拉列表：

<%: Html.DropDownListFor(model => model.LS.L1, Model.LS.Location1List, "-- choose place --", new { @class = "dd1" })%>

现在我需要将其更改为带有复选框列表的下拉列表。 这意味着两件事：

1. 模型大多数都是变化的，所以L1可以保存多个值（而不仅仅是一个int），maby也可以将Location1List从SelectList更改为某种列表？
2. DropDownListFor（组合框）大多数都改为“DropDownCheckListFor”。

重要的是，这是尽可能基本的，以便我们可以保持浏览器的兼容性（即使在智能手机上）。

您可以看到，在提交时将所选值填充到模型对象（通过默认活页夹）中也很重要。

我查看了这个下拉列表： http ： //www.erichynds.com/jquery/jquery-ui-multiselect-widget/

它看起来很不错，但我不知道如何将其转换为ASP.NET MVC，因此所选值将填充到提交的模型对象中（如DropDownListFor所做）。 此jquery解决方案也许不必要复杂。

请求建议

Answer 1

记住MVC助手只是呈现HTML标记。 因此，根据您链接的页面上的说明，您只需要生成

<select multiple="multiple">

为此，您需要使用Html.ListBoxFor而不是Html.DropDownListFor 。 然后，当您包含所有正确的javascript文件时，您只需添加一个javascript块。 看起来像这样：

$(function() {
   $('.dd1').multiselect();
});

Answer 2

本教程显示了创建多选下拉列表的完整分步指南，其中包含mvc Multiselect下拉列表中的复选框以及MVC中的复选框

你需要选择标签

<select id="CustomerId" name="CopyFromCustomerId"></select>

或者你可以使用Html.ListBoxFor

您需要以下脚本

$('#CustomerId').multiselect({
            includeSelectAllOption: true
        });

并在css和脚本文件下面

<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" type="text/css" />
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>     
<script type="text/javascript" src="http://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" type="text/css"/>