Question

我有两个下拉状态和城市。根据州选择的城市应该加载。所以我使用状态下拉更改事件来调用ajax方法来填充城市下拉列表。

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方法。我仔细检查了URL和DataType它是完美的。但是Action方法没有被调用。< / p>

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

    }

Answer 2

这是根据所选国家/地区加载国家/地区的代码。试试这个解决方案

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

Jquery Ajax调用不调用Asp.net mvc控制器动作方法

2 个答案: