変更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)); 
       }); 
      } 
     }); 
    } 

コントローラメソッドFillState

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>"); }); 
       });