2017-08-03 19 views
-1

私は2つのドロップダウン州とCity.According州選択された都市がロードされる必要があります。私は状態ドロップダウン変更イベントを使用してajaxメソッドを呼び出す市のドロップダウン。JqueryのAjaxコールはAsp.net mvcコントローラアクションメソッドを呼び出さない

HTML

<div class="row"> 
     <div class="col-sm-6 "> 
      <div class="form-group"> 
       <label>State</label> 
       @Html.DropDownListFor(m => m.State, Model.States, "Please select a State", new { @class = "form-control" }) 
      </div> 
     </div> 
    </div> 

    <div class="row"> 
     <div class="col-sm-6 "> 
      <div class="form-group"> 
       <label>Cities</label> 

       @Html.DropDownListFor(m => m.CityRegisterScreen, new SelectList(string.Empty, "Id", "Name"), "Please select a city", new { @class = "form-control" }) 
      </div> 
     </div> 
    </div> 

JavaScriptの これは、jQueryとJavascriptのコードが含まれています。

$(document).ready(function() { 


     $("#State").on("change", function() { // whenever a selection is made 
      $("#CityRegisterScreen").empty(); 

      var id = $("#State").val(); 


      $.ajax({ 
       type: 'GET', // we are calling json method 
       url: '@Url.Action("GetCitiesByDistrict", "Account")', 
       dataType: 'json', 
       contentType: 'application/json; charset=utf-8', 
       data: { id: id }, 
       success: function (cities) { 

        $.each(cities, function (i, city) { 
         $("#CityRegisterScreen").append('<option value="' + city.value + '">' + 
          city.Text + '</option>'); 
        }); 
       }, 
       error: function (ex) { 
        alert('Failed to retrieve cities.' + ex); 
       } 
      }); 
      return false; 
     }); 


    }); 

コントローラー これは

public JsonResult GetCitiesByDistrict(int id) 
    { 
     List<SelectListItem> cities = new List<SelectListItem>(); 

     var city = new List<City>(); 

     using (ApplicationDbContext context = new ApplicationDbContext()) 
     { 
      city = context.Cities.Where(e => e.DistrictId == id).ToList(); 
     } 

     return Json(new SelectList(city, "Id", "Name"), JsonRequestBehavior.AllowGet); 

    } 

問題がアヤックス方法はcontroller.Iでアクションメソッドを呼び出していないことが呼ばれる二重のURLをチェックされている場合であるJSONを返すコントローラのアクションメソッドでありますDataTypeは完全です。しかし、Actionメソッドは呼び出されませんでした。

+0

手動で新しいタブでそのURLを入力して、何が起こるかを見ることができますか?あなたはまだ問題を抱えていますか? –

+0

URLを手動で入力すると、json結果は表示されません。代わりにログインページに行きます。 –

+2

これは、要求が認証されていないことを意味します。あなたのアプリケーションには承認が必要なのでしょうか? –

答えて

1

これは愚かです!どのように私はこれを逃しましたか? @Rajshekar Reddyさん、ありがとうございました。私は[AllowAnonymous]属性がありません。

[AllowAnonymous] 
    public JsonResult GetCitiesByDistrict(int id) 
    { 
     List<SelectListItem> cities = new List<SelectListItem>(); 

     var city = new List<City>(); 

     using (ApplicationDbContext context = new ApplicationDbContext()) 
     { 
      city = context.Cities.Where(e => e.DistrictId == id).ToList(); 
     } 

     return Json(new SelectList(city, "Id", "Name"), JsonRequestBehavior.AllowGet); 

    } 
+1

'SelectList'を送り返すことはあなたのパフォーマンスを低下させています - あなたが必要とする2つのプロパティを持つ匿名オブジェクトを作成します。 'new SelectList(string.Empty、" Id "、" Name ")を使用して、[this DotNetFiddle](https://dotnetfiddle.net/1bPZym)のコードを調べることをお勧めします。 'ModelState'が無効であるため、ビューを返す必要があります。既存のデータを編集している場合です。 –

+0

ありがとう.. @StephenMuecke ..良い提案です...私は変更を行います.. –

+0

あなたは解決策を見つけました..ハッピーコーディング!!! –

0

これは、選択した国の国を読み込むためのコードです。この解決策を試してください。

HTML

@Html.DropDownListFor(model => model.CustAddr_Country_ID, Model.Countries, "Select Country", htmlAttributes: new { @class = "disableInput", @id = "ddlstate", @onchange = "javascript:GetCity(this.value);" }) 


@Html.DropDownListFor(model => model.CustAddr_State_ID, ViewBag.CustAddr_State_ID as SelectList, "Select State", htmlAttributes: new { @class = "disableInput"}) 

スクリプト

function GetCity(_stateId) { 
$("#CustAddr_State_ID").empty().trigger('change'); 
var newOption = new Option("Select State", 0, true, true); 
$("#CustAddr_State_ID").append(newOption).trigger('change'); 

if (_stateId != null && _stateId != "") { 
    var url = "/Ajax/GetCityByStaeId/"; 
    $.ajax({ 
     url: url, 
     data: { stateid: _stateId }, 
     cache: false, 
     type: "POST", 
     success: function (data) { 

      for (var x = 0; x < data.length; x++) { 
       var newOption = new Option(data[x].Text, data[x].Value, true, true); 
       $("#CustAddr_State_ID").append(newOption).trigger('change'); 
      } 
      $('#CustAddr_State_ID').val('0').trigger('change'); 

     }, 
     error: function (reponse) { 
      //alert("error : " + reponse); 
     } 
    }); 
} 

}

コントローラ

[HttpPost] 
    public ActionResult GetCityByStaeId(int stateid) 
    { 
     List<State> objcity = new List<State>(); 
     objcity = _state.GetState().Where(m => m.State_Country_ID == stateid).ToList(); 
     SelectList obgcity = new SelectList(objcity, "State_ID", "State_Name", 0); 
     return Json(obgcity); 
    } 
関連する問題