ASP.NET MVC 可变数量的下拉列表答案

【问题标题】：ASP.NET MVC variable number of dropdown listsASP.NET MVC 可变数量的下拉列表
【发布时间】：2016-09-28 21:06:03
【问题描述】：

考虑以下问题和可能的答案：ASP.Net MVC Multiple Drop Downs, Single List, Only Allow Unique Selections

忽略大部分细节，我们可以看到我们可以为 1-m 关系实现许多下拉菜单，如下所示：

<%: Html.DropDownListFor(model => model.DropwdownId1,Model.DropdownEntities) %>
<%: Html.DropDownListFor(model => model.DropwdownId2,Model.DropdownEntities) %>
<%: Html.DropDownListFor(model => model.DropwdownId3,Model.DropdownEntities) %>

DropdownId1、DropdownId2 和 DropdownId3 是很容易添加到模型中的属性，当且仅当我们确切知道要显示和回发多少下拉列表时。但是，我想实现可变数量的下拉菜单。例如，新的下拉菜单可以由 Javascript 动态添加。或者显示到视图中的下拉列表的数量可能取决于model 中的某些变量属性。比如说model.NumberOfDropDowns。

我该如何实现呢？如何编写可以处理可变数量下拉菜单的视图模型和控制器操作？

我已经阅读了很多复杂的东西，比如编辑器模板和动态添加表单元素的博客文章，但我真的很难弄清楚如何做到这一点。任何帮助将不胜感激

【问题讨论】：

您的问题是如何使用 JavaScript 动态添加下拉菜单？
不，我的问题是如何实现视图模型和回发控制器来处理可变数量的下拉菜单。这就是为什么我还提供了一个示例，我们使用 model.NumberOfDropDowns 来决定在视图中创建多少下拉菜单。
哦；好的。好消息是我们在 ASP.NET MVC 中没有回发，因此您不必担心这一点。由于您的问题是将多个值绑定到控制器操作，因此如果您可以编辑您的问题以使其清楚，这将有所帮助。
这需要自定义实现。有很多方法可以完成这项任务。
@TravisJ，您能否详细说明多种方式？我不希望有完整的教程，但是对我应该在谷歌上搜索的内容进行解释可能会有所帮助

标签： asp.net-mvc-4

【解决方案1】：

下拉输入仍然只有 1 个提交的表单值，因此它与任何其他可变长度视图模型属性相同：使用 List<T>，如下所示：

视图模型

class FooViewModel {
    public List<String> DropDownFields { get; set; }
}

控制器动作

[HttpGet]
ActionResult Index() {

    ViewData["dropDownSource"] = new List<SelectListItem>
              {
                   new SelectListItem
                   {
                        Text = "Test",
                        Value= "1"
                   },
                   new SelectListItem
                   {
                        Text = "Text",
                        Value= "2"
                   }
              };

    return View( new FooViewModel() );
}

[HttpPost]
ActionResult Index(FooViewModel vm) {

    for(int i = 0; i < vm.DropDownFields.Count; i++) {

        // for each dropdown
    }
}

查看（aspx语法）

<% for(int i = 0; i < vm.DropDownFields.Count; i++) { %>
    <%= Html.DropDownListFor( m => m.DropDownFields[i], (IEnumerable<SelectListItem>)ViewData["dropDownSource"] ) %>
<% } %>

【讨论】：