ASP.NET MVC 5 中的级联下拉列表答案

【问题标题】：Cascading dropdown lists in ASP.NET MVC 5ASP.NET MVC 5 中的级联下拉列表
【发布时间】：2014-05-22 01:03:27
【问题描述】：

我想知道在 ASP.NET MVC 5 中是否引入了一些新的帮助程序或方法来实现级联下拉列表。我知道一种在 MVC 3 和 MVC 4 中实现级联下拉列表行为的方法，即使用 JSON 调用

http://www.dotnet-tricks.com/Tutorial/mvc/HL53191212-Custom-Validation-for-Cascading-Dropdownlist-in-MVC-Razor.html

那么有人知道在 MVC 5 中实现级联下拉列表的更好方法吗？

【问题讨论】：

标签： asp.net-mvc razor cascadingdropdown

【解决方案1】：

我知道这是一个老问题，但仍然有人会觉得它很有用

我一直在寻找相同的东西，但找不到任何稳定且有用的东西，所以我最终自己实现了它：

请查看我创建的 Mvc.CascadeDropDown 助手。它适用于从 MVC3 开始的所有 MVC 版本，并且不需要任何客户端库（它使用纯原生 JavaScript）。

用法很简单：

@using Mvc.CascadeDropDown

//First simple dropdown 
@Html.DropDownListFor(m=>m.SelectedCountry, Model.Countries,
      "Please select a Country", new {@class="form-control"})

//Dropdown list for SelectedCity property that depends on selection of SelectedCountry property
@Html.CascadingDropDownListFor( 
  expression: m => m.SelectedCity, 
  triggeredByProperty: m => m.SelectedCountry,  //Parent property that trigers dropdown data loading
  url: Url.Action("GetCities", "Home"),  //Url of action that returns dropdown data
  actionParam: "country",   //Parameter name for the selected parent value that url action receives
  optionLabel: "Please select a City", // Option label
  disabledWhenParrentNotSelected: true, //If true, disables dropdown until parrent dropdown selected
  htmlAttributes: new { @class = "form-control" }) //Html attributes

希望对你们中的一些人有所帮助

【讨论】：

我尝试了这个块并使用默认的 ViewBag、propertyIds 得到错误。这是如何使用的 - 在创建表单中说级联下拉列表（只有 2 个级别）的所有值都来自数据库？
@Diin，请在github.com/alexanderar/Mvc.CascadeDropDown/issues 中打开一个问题，其中包含有关您的用例和您遇到的错误的一些详细信息。我会尝试解决它。我在多个项目的生产中使用了这个助手，所以 fad 没有遇到任何问题。顺便在github.com/alexanderar/Mvc.CascadeDropDown/tree/master/…项目中可以看到用法
这是一件很漂亮的事情，您所做的示例工作得很好，但我认为我的问题是如何让它从与功能无关的数据库中提取数据。有没有办法向您展示我的代码 - 您的代码运行良好，但我正在考虑使其从默认的 mvc scafolding 工作
嘿@AlexArt。如果我想传递多个 ajax 参数该怎么办，我的参数列表中同时包含国家 ID 和城市 ID。
当前库只支持一个触发器。一种可能的解决方案可能是将城市下拉列表的值更改为 countryID_cityID 的组合。然后在服务器上简单地用_分割值。

【解决方案2】：

不，MVC 5 中没有新的帮助程序或方法可以提供帮助。

Ajax HTML 帮助器在更新中被很大程度上忽略了。有些事情可能对与此相关的内容有所帮助：

有一个新的@Html.EnumDropDownListFor() HTML 帮助程序可以从枚举中填充下拉列表。
Attribute routing functionality 的Attribute routing functionality 已经过改进，现在可以与 Web API 一起使用，因此更容易将 URL 映射到 API 调用。
您现在可以在 EditorFor Html 帮助器 @Html.EditorFor(m => m.FieldName, new { htmlAttributes = new { @class = "form-control" } }) 中传递 html 属性

我上周实现了级联下拉菜单，并使用了您提到的经过验证的真实 JSON 调用。我喜欢将 this jQuery plugin 与带有新属性路由的 Web API v2 结合使用。

【讨论】：