更改 jquery 方法时下拉数据未更改

Question

在这里，我尝试根据国家/地区下拉列表的变化从状态表中获取数据。我收到内部服务器错误。 id 被传递给控制器​​方法，但数据没有返回。 这是我的代码： 查看代码：

  <div class="form-row">
                    <div class="col-md-3">Country:</div>
                    <div class="col-md-9">


                        @Html.DropDownListFor(model => model.CountryId, new SelectList(Model.Country, "Id", "Name"), "-- Select Country --", new { @class = "validate[required,maxSize[100]] select  select2insidemodal",@id="country", @onchange = "FillState()" })
                    </div>
                </div>
                <div class="form-row">
                    <div class="col-md-3">State:</div>
                    <div class="col-md-9">


                        @Html.DropDownListFor(m => m.State,
   new SelectList(Enumerable.Empty<SelectListItem>(), "StateId", "Name"),
          "Select State",
          new { @class = "form-control" })

                    </div>
                </div>

脚本代码：

  function FillState() {
        var countryId = $('#country').val();
        console.log(countryId);
        $.ajax({
            url: '/PM/Company/FillState'+'/'+countryId,
            method: "GET",
            //dataType: "JSON",
            success: function (states) {
                console.log(states);

                $("#State").html(""); // clear before appending new list 
                $.each(states, function (i, state) {
                    $("#State").append(
                        $('<option></option>').val(state.StateId).html(state.Name));
                });
            }
        });
    }

控制器方法填充状态

 public ActionResult FillState(int id)
    {
        var states = _stateService.GetStates(id);
        return Json(states,JsonRequestBehavior.AllowGet);

    }

状态服务正在返回值，但返回的 Json 没有返回任何东西，我在控制台上收到内部服务器错误。 当我在 xhr 中看到 ajax 请求时，当我打开该请求详细信息时，它会显示以下错误： “/”应用程序中的服务器错误。

序列化类型对象时检测到循环引用 'System.Data.Entity.DynamicProxies.State_6630E5941FBD9204A46907DE2F85C16BCADAC553D22FB81D0F45AD891174D200'。

请在这方面帮助我；

Answer 1

使用以下方法：

public JsonResult FillState(int? CountryId)
{
    var states = _stateService.GetStates().Where(p => p.countryId == CountryId).ToList();
    return Json(new SelectList(states.ToArray(), "StateId", "Name"), JsonRequestBehavior.AllowGet);
}

还有你的 ajax 成功函数：

 $.each(states, function (i, state) {
                    $("#State").append("<option value='" + state.StateId + "'>" + state.Name + "</option>"); });
                });