Im trying to make a cascading dropdown list for Classes and Subjects, when I select a Class from the dropdown list the subject Dropdown shows subjects that are in the responding Class. But the subject value that is returned in the controller is (Undefined)
Here is my view
<div class="form-group">
@Html.LabelFor(model => model.PDFClass, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownListFor(model => model.PDFClass, ViewBag.ClassName as SelectList, "Please Select", new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.PDFClass, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PDFSubject, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownListFor(model => model.PDFSubject, new SelectList(" "), "Please Select", new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.PDFSubject, "", new { @class = "text-danger" })
</div>
</div>
here is the Ajax
<script>
$(document).ready(function () {
$("#PDFClass").change(function () {
$.get("/Home/GetStateList", { Class: $("#PDFClass").val() }, function (data) {
$("#PDFSubject").empty();
$.each(data, function (index, row) {
$("#PDFSubject").append("<option value = '" + row.Class + "'>" + row.SubjectName + "</option>")
debugger;
});
});
})
});
</script>
Here is the method that gets a list of Classes&Subjects relation Table to the Ajax
public JsonResult GetStateList(string Class)
{
var List1 = context.ClassesWithSubjects_.ToList().Where(i => i.ClassName == Class);
return Json(List1, JsonRequestBehavior.AllowGet);
}