Question

我在视图中有两个下拉状态，名为State和City ..而选择State需要显示相应的城市，但无法提取CityId和CityName For City DropDown。

控制器

public JsonResult cities(int state, Employee employee)
{
    var cities = new SelectList(db.Cities.Where(c => c.StateId == state), "CityId", "CityName", employee.City);
    return Json(cities,JsonRequestBehavior.AllowGet);
}

Jquery的

<script>
    $(document).ready(function () {
        $("#City").prop("disabled", true);
        $("#State").change(function () {
            if ($("#State").val() != 1) {
                var StateOptions = {};
                StateOptions.url = "/Employees/cities";
                StateOptions.type = "POST";
                StateOptions.data = JSON.stringify({ State: $("#State").val() });
                StateOptions.datatype = "json";
                StateOptions.contentType = "application/json";
                StateOptions.success = function (CitysList) {
                    $("#City").empty();
                    for (var i = 0; i < CitysList.length; i++) {

              // Unable to extract CityID and CityName in option here

                        $("#City").append("<option value=" + CitysList[i]  + ">" + CitysList[i] + "</option>");
                    }
                    $("#City").prop("disabled", false);
                };
                StateOptions.error = function () { alert("Error in Getting Citys!!"); };
                $.ajax(StateOptions);
            }
            else {
                $("#City").empty();
                $("#City").prop("disabled", true);
            }
        });
    });
</script>

这些是视图中的州和城市下拉列表.........

<div class="form-group">
            @Html.LabelFor(model => model.State, "State", htmlAttributes: new { @class = "control-label col-md-2"})
            <div class="col-md-10">
                @Html.DropDownList("State", null, htmlAttributes: new { @class = "form-control"})
                @Html.ValidationMessageFor(model => model.State, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.City, "City", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
              @Html.DropDownList("City", new SelectList(Enumerable.Empty<SelectListItem>(), "CityId", "CityName"),  "Select City", htmlAttributes: new { @class = "form-control" })
                 @Html.ValidationMessageFor(model => model.City, "", new { @class = "text-danger" })
            </div>
        </div>

Answer 1

var stId = $("#State").val(); StateOptions.data = { state: stId };

删除员工员工，因为您没有发送此值。

删除此StateOptions.contentType =＆＃34; application / json＆＃34;;

像这样改变你的方法

public JsonResult cities(int state)
{ 
      var cities = (from city in db.Cities where city.StateId == state select new CityModel
                   { 
                         CityId = city.CityId, CityName = city.CityName 
                   }).ToList();
      return Json(cities,JsonRequestBehavior.AllowGet);
}

你这样的ajax成功电话

 success: function (CitysList) { 
         $.each(CitysList, function (i, val) 
         {      
                $('#City').append($("<option/>", ($({ value: val.CityId, text: val.CityName })))); 
         }); 
 },

MVC 5 DropDownList OnSelect更改

1 个答案: