Question

以下是我的cascasde下拉列表查询。国家列表加载但不在我的下拉列表中加载的状态。如果有人可以帮我纠正查询请。

        public ActionResult CountryList()
        {

            var countries = db.Countries.OrderBy(x=>x.CountryName).ToList(); 
        //    IQueryable countries = Country.GetCountries();

            if (HttpContext.Request.IsAjaxRequest())
            {
                return Json(new SelectList(
                            countries,
                            "CountryID",
                            "CountryName"), JsonRequestBehavior.AllowGet
                            );
            }

            return View(countries);
        }

        public ActionResult StateList(int CountryID)
        {
            IQueryable <State> states= db.States. Where(x => x.CountryID == CountryID);

            if (HttpContext.Request.IsAjaxRequest())
                return Json(new SelectList(
                                states,
                                "StateID",
                                "StateName"), JsonRequestBehavior.AllowGet
                            );

            return View(states);
        }

以下是包含java脚本的View文件：

@section scripts {
    <script type="text/javascript">
        $(function () {
            $.getJSON("/Dropdown/Countries/List",function (data) {
                var items = "<option>---------------------</option>";
                $.each(data, function (i, country) {
                    items += "<option value='" + country.Value + "'>" + country.Text + "</option>";
                });
                $("#Countries").html(items);
            });

            $("#Countries").change(function () {
                $.getJSON("/Dropdown/States/List/" + $("#Countries > option:selected").attr("value"), function (data) {
                    var items = "<option>---------------------</option>";
                    $.each(data, function (i, state) {
                        items += "<option value='" + state.Value + "'>" + state.Text + "</option>";
                    });
                    $("#States").html(items);
                });
            });
        });
    </script>
}

<h1>@ViewBag.Title</h1>

@using (Html.BeginForm())
{
    <label for="Countries">Countries</label>
    <select id="Countries" name="Countries"></select>
    <br /><br />
    <label for="States">States</label>
    <select id="States" name="States"></select>
    <br /><br />
    <input type="submit" value="Submit" />
}

Answer 1

首先，您的操作方法名称为StateList，其中需要一个名为CountryID的参数。但是你的代码没有用这样的查询字符串参数调用你的StateList动作方法。所以解决这个问题。

$("#Countries").change(function () {
    $.getJSON("@Url.Action("StateList","Home")?CountryID=" + 
                                                $("#Countries").val(), function (data) {
        var items = "<option>---------------------</option>";
        $.each(data, function (i, state) {
            items += "<option value='" + state.Value + "'>" + state.Text + "</option>";
        });
        $("#States").html(items);
    });
});

我还使用了@Url.Action辅助方法来获取操作方法的正确网址，并假设您的StateList操作方法属于HomeController。根据需要根据您的实际控制器名称更新参数。

现在，在你的action方法中，你不应该尝试返回IQueryable集合，你可以简单地将数据投影到SelectListItem列表并返回它。

public ActionResult StateList(int CountryID)
{
    var states = db.States.Where(x => x.CountrId==CountryID).ToList(); 
    //this ToList() call copies the data to a new list variable.

    var stateOptions = states.Select(f => new SelectListItem { 
                                                         Value = f.StateID.ToString(), 
                                                         Text = f.StateName }
                                    ).ToList();

    if (HttpContext.Request.IsAjaxRequest())
        return Json(stateOptions, JsonRequestBehavior.AllowGet);

    return View(states);
}

MVC控制器查询

1 个答案: