ASP.NET MVC 4 Erlauben dem Benutzer, Wählen Sie Status, und laden Sie dann die Stadt

Vor kurzem habe ich gebloggt über cascading dropdownlists in MVC4, die ich denke, ist, was Sie nach (obwohl ein wenig mehr detail wäre geschätzt)

http://jnye.co/Posts/12/creating-cascading-dropdownlists-using-mvc-4-and-jquery

In der Essenz, in Ihrem controller:

public ActionResult Index()  
{  
    //These countries are equivalent to your states
    var states = new List<string> {"Ohio", "California", "Florida"};  
    var stateOptions = new SelectList(states);  
    ViewBag.States = stateOptions;  
    return View();  
}  

public JsonResult GetCities(string state)  
{  
    var cities = new List>string<();  
    switch (country)  
    {  
        case "Florida":  
            states.Add("City1");  
            states.Add("City2");  
            states.Add("City3");  
            break;  
        case "Ohio":  
            states.Add("City4");  
            states.Add("City5");  
            break;  
        case "California":  
            states.Add("City6");  
            states.Add("City7");  
            break;  
    }  
    //Add JsonRequest behavior to allow retrieving states over http get  
    return Json(cities, JsonRequestBehavior.AllowGet);  
}  

Dann, aus Ihrer Sicht

@using (Html.BeginForm())  
{  
    <div>Select state:</div>  
    <div>@Html.DropDownList("state",   
                            ViewBag.States as SelectList,   
                            "Please select",   
                            new { id = "state" })  
    </div>  
    <div>Select City:</div>  
    <div>  
        <select id="city" disabled="disabled"></select>  
    </div>  
    <input type="submit" value="Submit"/>  
}  

@section scripts{  
    <script type="text/javascript">  
        $(function() {  
            $('#state').on('change', function() {  
                var cityDropdown = $('#city');  
                //disable city drop down  
                cityDropdown.prop('disabled', 'disabled');  
                //clear drop down of old city
                cityDropdown.empty();  

                //retrieve selected state
                var state = $(this).val();  
                if (state.length > 0) {  
                    //retrieve data using a Url.Action() to construct url  
                    $.getJSON('@Url.Action("GetCities")', {  
                        state: state  
                    })  
                    .done(function (data) {  
                        //re-enable city drop down  
                        cityDropdown.removeProp('disabled');  
                        //for each returned state  
                        $.each(data, function (i, city) {  
                            //Create new option  
                            var option = $('<option />').html(city);  
                            //append city states drop down  
                            cityDropdown.append(option);  
                        });  
                    })  
                    .fail(function (jqxhr, textStatus, error) {  
                        var err = textStatus + ", " + error;  
                        console.log("Request Failed: " + err);  
                    });  
                }  
            });  
        })  
    </script>  
}