2017-08-03 54 views
-1

我有两个下拉状态和City.Acording状态选择城市应该加载。所以我使用状态下拉更改事件来调用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; 
     }); 


    }); 

控制器 这是返回的Json

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

    } 

的问题是,当AJAX方法被调用它不调用Action方法controller.I双重检查URL中的控制器的操作方法和DataType都是完美的。但Action方法没有被调用。

+0

可以手动在新标签中输入该网址,看看会发生什么?你还有这个问题吗? –

+0

如果我手动输入URL,它不会显示json结果。相反,它转到登录页面.. –

+2

这意味着请求未通过身份验证。我认为你的Ajax调用也是这个问题......你的应用程序是否需要授权? –

回答

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个属性创建一个匿名对象。并建议你在[DotNetFiddle](https://dotnetfiddle.net/1bPZym)中学习代码 - 使用新的SelectList(string.Empty,“Id”,“Name”)'表示下拉菜单不会正确填充if你需要返回视图,因为'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); 
    } 
相关问题