Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
640 views
in Technique[技术] by (71.8m points)

razor - Cascading dropdown lists in ASP.NET MVC 5

I am wondering if there's some new helper or method introduced in ASP.NET MVC 5 to implement cascading dropdown lists. I know a way to implement cascading dropdownlist behavior in MVC 3 and MVC 4 that is by using a JSON call

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

So anyone knows a better way to implement cascading dropdownlists in MVC 5?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

I know that this is an old question but somebody still may find it useful

I was searching for the same thing but din't find anything stable and useful so I ended up implementing it by myself:

Please take a look at Mvc.CascadeDropDown helper that I created. It works with all MVC versions starting from MVC3 and doesn't require any client side libraries(It uses plain vanilla JavaScript).

The usage is very simple:

@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

Hopefully it will be helpful for some of you


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...