Loading MVC Dropdowns using viewbags ajax when changing a dropdown?

Question

@Html.DropDownList("CountryID", (SelectList)ViewBag.CounrtyList,new { style = "width:150px;" })

@Html.DropDownList("CityID", (SelectList)ViewBag.CityList,new { style = "width:150px;" })

@Html.DropDownList("StateID", (SelectList)ViewBag.StateList,new { style = "width:150px;" })

@Html.DropDownList("DistrictID", (SelectList)ViewBag.DistrictList,new { style = "width:150px;" })

How can I change city, state and district values in a single ajax call when changing the Country dropdown?

Suggest you study the code in [this DotNetFiddle](https://dotnetfiddle.net/1bPZym) — , May 08 '18 at 00:02

score 0 · Answer 1 · answered May 07 '18 at 12:55

The idea is called Cascading Drop Downs, and you can see this technique here: Cascading update of two @Html.DropDownListFor in MVC4 with model binding

It links to an example using a partial view, but JSON could be returned instead. I think that is the best option because you can return a JSON object of:

{ cities: [], states: [], districts: [] }

And then wire up the cities to the correct DDL. OR use the partial view approach as linked above but call it 3 times (less efficient that way).

Loading MVC Dropdowns using viewbags ajax when changing a dropdown?

1 Answers1