bind drop down list using jquery ajax on change of first ddl

Question

I have two drop down lists, onchange of first drop downlist i want to populate the second one in ajax. I get the SelectListItem in ajax how to pass that to drop down list to

Answer 1

Start by fixing your controller action so that it returns JSON and not some IEnumerable<SelectListItem>. Remember that in ASP.NET MVC controller actions must return ActionResults:

public ActionResult BuildSecondDropDownLists(int id)
{
    var result = GetData();
    return Json(result, JsonRequestBehavior.AllowGet);
}

and then loop through the returned elements and append them to the second dropdown:

success: function (result) {
    var secondDdl = $('#SecondID');
    secondDdl.empty();
    $.each(result, function() {
        secondDdl.append(
            $('<option/>', {
                value: this.SecondID,
                html: this.Name
            })
        );
    });
}