getJSON填充下拉列表MVC4

时间:2013-08-07 10:28:08

标签: jquery json asp.net-mvc-4 getjson cascadingdropdown

我有以下控制器操作:

[HttpPost]
    public ActionResult GetCourseSections(int courseID)
    {  
         var Sections = dbcontext.CourseSection.Where(cs => cs.CourseID.Equals(courseID)).Select(x => new
        {
            sectionID = x.CourseSectionID,
            sectionTitle = x.Title
        });
        return Json(Sections, JsonRequestBehavior.AllowGet);
    }

这将返回我期待的列表。然后,我尝试使用以下代码检索此列表以填充下拉列表:

$.getJSON('@Url.Action("GetCourseSections", "Admin")',
            function(data) {
                var courseSectionDropdown = $('#coursesectiondd');
                courseSectionDropdown.empty();
                courseSectionDropdown.append($('<option/>', {
                    value: 0,
                    text: "Test"
                }));
                $.each(data, function (index, data) {
                    courseSectionDropdown.append($('<option/>', {
                        value: data.value,
                        text: data.text
                    }));
                });
            });

虽然在调试时我能够在添加它们时看到JSON对象列表,但是添加的唯一列表项是我正在设置的默认选项“Test”。任何人都可以从我的代码中看到为什么没有读取数据?我在jquery中犯了错误

3 个答案:

答案 0 :(得分:1)

您需要将jQuery数据属性与方法中的相同名称匹配:

$.getJSON('@Url.Action("GetCourseSections", "Admin")', null,
        function(data) {
            var courseSectionDropdown = $('#coursesectiondd');
            courseSectionDropdown.empty();
            courseSectionDropdown.append($('<option/>', {
                value: 0,
                text: "Test"
            }));
            $.each(data, function (index, data) {
                courseSectionDropdown.append($('<option/>', {
                    value: data.sectionID,
                    text: data.sectionTitle
                }));
            });
 });

答案 1 :(得分:0)

试试这个..它会起作用......

  $.getJSON("@Url.Content("~/Admin/GetCourseSections")", null, function (data) {
         $('#coursesectiondd').empty();
         for (i = 0; i < data.length; i++) {    
                 $('#coursesectiondd').append($('<option></option>').text(data[i].sectionTitle).attr('ID', data[i].sectionID));
          } 
    });

答案 2 :(得分:0)

它会起作用......

 function changeSltLeague() {
    $.getJSON('/league/GetByName',
        { leagueName: $("#sltLeagueId option:selected").text() },
        function (data) {
            currentLeagueId = data.Id;
            currentLeague = data.Name;
            showNextRoundInfo('/round/GetNextRoundOfLeague', data.Id);
        });
}
 $(document).ready(function () {
    var leagueId = @leagueId;

    if (leagueId > 0) {
        $('#sltLeagueId option[value=' + leagueId +']').attr("selected", true);

        changeSltLeague();
    }

});