jQuery MultiSelect 下拉列表如何访问结果？答案

【问题标题】：jQuery MultiSelect dropdownlist how to access results?jQuery MultiSelect 下拉列表如何访问结果？
【发布时间】：2011-10-19 03:30:53
【问题描述】：

如何从根据 mvc3/razor 调用的 JQUery 多选下拉列表中获取结果？

http://abeautifulsite.net/blog/2008/04/jquery-multiselect/

【问题讨论】：

标签： jquery asp.net-mvc-3 razor

【解决方案1】：

多选插件使用[] 表示法将选定的值发送到服务器。与往常一样，我们从编写视图模型开始：

public class MyViewModel
{
    public IEnumerable<string> SelectedValues { get; set; }

    public IEnumerable<SelectListItem> Items
    {
        get
        {
            return new[]
            {
                new SelectListItem { Value = "1", Text = "item 1" },
                new SelectListItem { Value = "2", Text = "item 2" },
                new SelectListItem { Value = "3", Text = "item 3" },
            };
        }
    }
}

然后是控制器：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new MyViewModel());
    }

    [HttpPost]
    public ActionResult Index(MyViewModel model)
    {
        return View(model);
    }
}

对应的视图：

@model MyViewModel

<script src="@Url.Content("~/Scripts/jquery.multiSelect.js")" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $("#SelectedValues").multiSelect();
    });
</script>

@using (Html.BeginForm())
{
    @Html.ListBoxFor(x => x.SelectedValues, Model.Items)
    <button type="submit">OK</button>
}

最后是与 IEnumerable<string> 类型关联的模型绑定器，它将与插件使用的 [] 表示法一起使用：

public class MultiSelectModelBinder : DefaultModelBinder
{
    public override object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
    {
        var model = (MyViewModel)base.BindModel(controllerContext, bindingContext);
        var value = bindingContext.ValueProvider.GetValue(bindingContext.ModelName + "[]");
        if (value != null)
        {
            return value.RawValue;
        }
        return model;
    }
}

最后一部分是在Application_Start中注册模型绑定器：

ModelBinders.Binders.Add(typeof(IEnumerable<string>), new MultiSelectModelBinder());

【讨论】：

【解决方案2】：

请尝试此操作以获取选定的值

public ActionResult Index(MyViewModel model, FormCollection collection)
    {
        string selectedValues=collection["SelectedValues[]"]; //here you get comma separated values
        return View(model);
    }

【讨论】：

这是一个很棒的小捷径，而不是通过 [] 模型的迭代器。谢谢！

【解决方案3】：

实际上，您也可以通过向您的操作添加参数来接收选定的值。

例如，假设您有以下列表框：

//Controller GET
public ActionResult ManageUsers()
{
    ViewBag.Users = new SelectList(repository.GetAllUsers(), "Id", "Email");
    return View();
}

//View
@Html.ListBox(ViewBag.Users as SelectList, new { @id = "users" })

//Controller POST
[HttpPost]
public ActionResult ManageUsers(List<int> users)
{
    //Manage all the selected users which will appear in the List.

    return View()...
}

我相信您也可以将数组作为类型而不是通用列表，虽然我自己没有尝试过，但关键是将参数命名为与列表框的 html 元素 ID 相同。

【讨论】：