Populating Dropdownlist Using MVC2 Based On Another Dropdownlist (Cascading DropDownList)

Question

I am making an application that deals with vehicles. I need two DropDownLists:

• Makes: All Vehicle Makes
• Models: Models that belong to the selected

Answer 1

This is what I ended up doing... Didn't need additional plugins / 1000 Lines of code...

The Html

//The first DDL is being fed from a List in my ViewModel, You can change this...
<%: Html.DropDownList("MakeList", new SelectList(Model.Makes, "ID", "Name")) %>

The JQuery

    $(document).ready(function () {
        $('#MakeList').change(function () {
            $.ajaxSetup({ cache: false });
            var selectedItem = $(this).val();
            if (selectedItem == "" || selectedItem == 0) {
                //Do nothing or hide...?
            } else {
                $.post('<%: ResolveUrl("~/Sell/GetModelsByMake/")%>' + $("#MakeList > option:selected").attr("value"), function (data) {
                    var items = "";
                    $.each(data, function (i, data) {
                        items += "" + data.Name + "";
                    });
                    $("#ModelID").html(items);
                    $("#ModelID").removeAttr('disabled');
                });
            }
        });
    });

The Action

    [HttpPost]
    public ActionResult GetModelsByMake(int id)
    {
        Models.TheDataContext db = new Models.TheDataContext();
        List models = db.Models.Where(p=>p.MakeID == id).ToList();

        return Json(models);
    }