如何在选择另一个@ Html.DropDownList 后填充@ Html.DropDownList

DropDownList加载了一些类别，我需要填充另一个@ Html.DropDownList，具体取决于在第一个下拉列表中选择的选项。

这是我用来填充第一个下拉列表的代码：

在控制器上：

TecnicService ListCategory = new TecnicService(); IList resultCat = ListCategory.GetCategory(); List CatDropDown = new List(); foreach (Category in resultadoCat) { CatDropDown.Add(new SelectListItem { Value = a.Id.ToString(), Text = a.Name.ToString() }); } 

在视图上：

  @model APP.Models.DataViewModel @using (Html.BeginForm("NewPol", "Tecnic", null, FormMethod.Post, new { id = "pol-data-form", @class = "form-horizontal" })) { 
 Category 
 @Html.DropDownList("BasicData", Model.Category, new { @class= "required", name="category"}) 
 
 
 Ram 
 @Html.DropDownList() WHAT DO I DO HERE??????? 
 
 . .} 

我通过返回List的服务获取数据，现在我需要填充第二个下拉列表，具体取决于第一个下拉列表的选择。

Answer 1

您正在寻找的是Cascading Drop Down List 。

您可以创建一个jQuery插件来跟踪更改并向服务器发送ajax请求以获取另一个下拉列表的值：

 (function ($) { $.fn.cascade = function (options) { var defaults = { }; var opts = $.extend(defaults, options); return this.each(function () { $(this).change(function () { var selectedValue = $(this).val(); var params = { }; params[opts.paramName] = selectedValue; $.getJSON(opts.url, params, function (items) { opts.childSelect.empty(); $.each(items, function (index, item) { opts.childSelect.append( $('') .attr('value', item.Id) .text(item.Name) ); }); }); }); }); }; })(jQuery); 

然后简单地将其连线：

 $(function () { $('#SelectedProvinceId').cascade({ url: '@Url.Action("Cities")', paramName: 'provinceId', childSelect: $('#SelectedCityId') }); $('#SelectedCityId').cascade({ url: '@Url.Action("Suburbs")', paramName: 'cityId', childSelect: $('#SelectedSuburbId') }); }); 

来源： MVC 3 Razor视图中的级联下拉

来自简单谷歌搜索的更多来源：

AJAX与MVC4级联

http://www.sidecreative.com/Blog/Entry/Cascading-dropdown-lists-with-MVC4-and-jQuery

http://www.codeproject.com/Articles/258172/Simple-Implementation-of-MVC-Cascading-Ajax-Drop-D

Answer 2

它通常用ajax完成。 您可以通过编写一些JQuery代码或使用可以在Web上执行的许多插件中的一个来完成它。

作为旁注，我注意到你使用TwitterBootstrap。 查看TwitterBootstrapMvc 。 您可能会发现它很有用。

不知道为什么亚当的答案被低估了。 他实际上给了一个很好的答案。 不知道gusadolfo是否因为没有提供代码而对其进行了贬低。 如果是这样的话，gusadolfo，不要指望代码。 我们可以指导您，修复您在某处犯下的错误，但不要指望我们完全完成您的工作。