Question

我的cacading下拉列表在第二次下拉列表中显示未定义的结果。这是我的视图，其中我添加了2下拉列表。基本上我想要当我从分支下拉列表中选择分支时，必须在类下拉列表中显示相关的类。

@Html.DropDownListFor(m => m.BranchID, Model.BranchList, new { @class = "input-class",@id="bid" 
@Html.DropDownListFor(m => m.ClassID, Model.ClassLists, new { @class = "input-class" ,@id="Cid"})

这里我正在制作Ajax Call

$("#bid").change(function () {
  $("#Cid").empty();
  $.ajax({
    type: 'GET',
    url: '@Url.Action("../AssignSubjToTeacher/GetClass/")',
    dataType: 'json',
    data: { id: $("#bid").val() },
    success: function (classes) {
      $.each(classes, function (i, class) {
        $("#Cid").append('<option value="'+ class.Value'">'+class.Text + '</option>');
      });
    },
    error: function (ex) {
      alert('Failed to retrieve states.' + ex);
    }
  });
  return false;
})

这是控制器代码

public JsonResult GetClass(Models.SubjAssignToTeacherModel  DisplayRecord, string id)
{
  List<ClassList> objAddclass = new List<ClassList>();
  objAddclass = GetDropDownListclassGet(id);
  SelectList objListOfclass = new SelectList(objAddclass, "ID", "Name",0);
  DisplayRecord.ClassList = objAddclass;
  return Json(DisplayRecord, JsonRequestBehavior.AllowGet);
}

Answer 1

以下行有错误：

$("#Cid").append('<option value="'+ class.Value'">'+class.Text + '</option>');

应该是：

$("#Cid").append('<option value="' + class.Value + '">' + class.Text + '</option>');

如果这不能解决'undefined' - 返回的数据（类）是否符合预期？

根据评论：

$.each(classes.ClassList, function (i, class) {
    $("#Cid").append('<option value="'+ class.ID +'">'+ class.Name +'</option>');
});

Answer 2

将控制器方法更改为

public JsonResult GetClass(string id)
{
  var data = GetDropDownListclassGet(id).Select(c => new { ID = c.ID, Name = c.Name });
  return Json(data, JsonRequestBehavior.AllowGet);
}

然后在ajax成功函数中

success: function (classes) {
  $.each(classes, function (i, class) {
    $("#Cid").append('<option value="'+ class.ID'">'+class.Name + '</option>');
  });
}

级联下拉列表在第二次下拉列表中显示未定义的结果

2 个答案: