Question

我遇到级联下拉列表的问题，其中第二个ddl应该出现在局部视图中，我自己无法处理它。请帮我弄清楚为什么我有以下包？

所以，我有第一个ddl的视图，用户可以选择一个品牌：

@Html.DropDownList("brands", new SelectList(
@ViewBag.Brands, "Id", "BrandName"),
"--select a Brand--",
new
{
id = "ddlBrands",
data_url = Url.Action("ChooseModel", "Home")
})
<div id="divModel"></div>

ChooseModel方法返回以下部分视图：

<div id="chooseModel">
<div class="lead">Model</div>
@Html.DropDownList("models", new SelectList(Enumerable.Empty<SelectListItem> 
(), "Id", "ModelName"),
"--select a Model--",
new { id = "ddlModels" })
</div>

当用户在ddlBrands中选择项目时，应显示模型的另一个下拉列表。所以，脚本看起来像这样：

  $(function () {
    $("#ddlBrands").change(function () {

        var url = $(this).data('url');
        var value = $(this).val();
        $('#divModel').load(url, { id: value });

        var brandId = $(this).val();
        $('#divModel').html("");
        $.getJSON("../Home/LoadModels", { brandId: brandId },
            function (modelData) {
                var select = $("#ddlModels");
                select.empty();
                select.append($('<option/>', {
                    value: 0,
                    text: "-- select a Model --"
                }));
                $.each(modelData, function (index, itemData) {
                    select.append($('<option/>', {
                        value: itemData.Value,
                        text: itemData.Text
                    }));
                });
            });
    });
});

最后，LooksModels方法加载特定品牌的模型：

public JsonResult LoadModels(string brandId)
{
   if (string.IsNullOrEmpty(brandId))
         return Json(HttpNotFound());

        var modelList = unitOfWork.ModelRepository
                        .GetModelListByBrand(Convert.ToInt32(brandId)).ToList();
        var modelData = modelList.Select(m => new SelectListItem()
            {
                Text = m.ModelName,
                Value = m.Id.ToString()
            });

        return Json(modelData, JsonRequestBehavior.AllowGet);
    }

因此，当我启动应用程序并在第一个ddl中选择一个品牌时，子模型在第二个中显示正常。然后我选择另一个品牌，再次出现正确的模特。但是当我选择我第一次选择的品牌时，我无法选择任何型号 - ddlModels只显示我 - 选择一个型号 - 。

你能告诉我脚本（我猜）我有什么错误吗？

Answer 1

试试这个脚本：

<script type="text/javascript">
          $(document).ready(function () {
             $("#ddlBrands").change(function () {
              firstDDLValue = $("#ddlBrands").val();
               $.post('@Url.Action("LoadModels", "Home")', { fstValue: firstDDLValue },               function (result) {
                       var select = $("#ddlModels");
                       select.empty();
                       select.append($('<option/>', { value: '', text: '--Select--' }));
                       $.each(result, function (index, Data) {
                       select.append($('<option/>', {
                       value: Data.Value,
                       text: Data.Text
                       }));
                    });
               });
                    });
                  });
    </script>

Answer 2

在Controller上使用它：

public JsonResult LoadModels(string fstValue)
        {
            YourClassname obj= new YourClassname ();
            int Id = 0;
            if (fstValue != "")
                Id = Convert.ToInt32(fstValue);
            var result = obj.GetModelListByBrand(Convert.ToInt32(Id ));

            IList<SelectListItem> Data = new List<SelectListItem>();
            for (int i = 0; i < result.Count; i++)
            {
                Data.Add(new SelectListItem()
                {
                    Text = result[i].Text,
                    Value = result[i].Value,
                });
            }
            return Json(Data, JsonRequestBehavior.AllowGet);
        }

具有部分视图问题的级联下拉列表

2 个答案: