Question

我想使用ajax填充下拉列表但我收到错误。如何使用ajax / jquery将Json结果绑定到下拉列表。所以任何帮助将不胜感激。这是我的控制器。

     public  JsonResult GetMonths(int YearId)
    {
        CCIRepository _repository = CCIRepository.CreateRepository();
        List<MonthListClass> list = new List<MonthListClass>();
        list =  _repository.GetMonthFromImportDate(YearId);
        return Json(new SelectList(list, "Value", "Text"));
    }

这是我的Ajax代码。

      <p>
    <h3>Year:</h3>@Html.DropDownList("Yearitems",       (IEnumerable<SelectListItem>)ViewBag.SelectList, "Select Year")
    <h3>Month:</h3>@Html.DropDownList("MonthItems",(IEnumerable<SelectListItem>)ViewBag.SelectMonthList,"Select Month")
</p>
<p><input type="submit" value="Search" /></p>

<script>
    $(document).ready(function () {
        $("#Yearitems").change(function () {
            debugger;
            alert($("#Yearitems>option:selected").attr("Value"));
            $.ajax({
                type: "Get",
                url: '@Url.Action("GetMonths","AirtelManagement")',
                data: { YearId: $("#Yearitems>option:selected").attr("Value") },
                datatype: "Json",
                success: function (data) {
                    debugger;
                    $("#MonthItems").empty();
                    $.each(data, function (index, item) {
                        debugger;
                        $("#MonthItems").append('<option>', {
                            value: item.value,
                            text: item.text
                        }, '</option>')
                    });
                    //$("#MonthItems").html(items);
                },
                error: function () {
                    alert("An Error Occured");
                }
            });
        });
    });
</script>

Answer 1

根据您提供的信息，我会像这样做

[HttpPost]
public  JsonResult GetMonths(int YearId)
{
    CCIRepository _repository = CCIRepository.CreateRepository();
    List<MonthListClass> list = new List<MonthListClass>();
    list =  _repository.GetMonthFromImportDate(YearId);
    return Json(list);
}

并在脚本中

      type: "POST",
      url: '@Url.Action("GetMonths","AirtelManagement")',
      data:  JSON.stringify({ YearId: $("#Yearitems").val() }),
      datatype: "Json",
      success: function (data) {

                $("#MonthItems").html("");
                $.each(data, function (index, item) {
                    debugger;
                    $("#MonthItems").append(new Option(item.MonthName, item.MonthSelectedId));
                });
                //$("#MonthItems").html(items);
            },

试试吧

将Json结果绑定到Dropdownlist

1 个答案: