如何根据另一个下拉列表的选定值填充下拉列表? MVC

时间:2020-03-30 19:50:32

标签: javascript c# jquery ajax asp.net-mvc

我目前正在尝试根据下拉列表中选择的品牌填充汽车型号的值。我是编码的新手,所以不确定我的错误是什么。该项目没有给我任何错误,但是选择make时没有显示任何值。

这是我要添加到“创建视图”中的局部视图。

@model IgnitionHubPractice.Models.MakeModelDorpdownView

<div class="form-horizontal">
    <div class="form-group">
        @if (ViewBag.MakeList != null)
        {
            @Html.DropDownListFor(m => m.MakeID, ViewBag.MakeList as SelectList, "--Select Make--", new { @class = "form-control" })
        }
    </div>
    <div class="form-group">
        @Html.DropDownListFor(m => m.ModelID, new SelectList(" "), "--Select Model--", new { @class = "form-control" })
    </div>
</div>
<script>
    $(document).ready(function () {
        $("#MakeID").change(function () {
            $.get("/Cars/GetModelList",{ MakeID: $("MakeID").val() }, function (data) {
                $("#ModelID").empty();
                $.each(data, function (index, row) {
                    $("#ModelID").append("<option value ='" + row.ModelID + "' >" + row.Name + </option>")
                });
            });
        })
    });
</script>

这是我的控制器

        public ActionResult Create([Bind(Include = "CarID,Year,Color,Mileage,Cost,MarketValue,BodyType,Drive,Notes,Available,VinNumber,CarLotID,ModelID")] Car car, [Bind(Include ="MakeID,Name")] Make make)
    {


        if (ModelState.IsValid)
        {
            db.Cars.Add(car);
            db.SaveChanges();
            return RedirectToAction("Index");
        }
        List<Make> MakeList = db.Makes.ToList();
        ViewBag.MakeList = new SelectList(db.Makes, "MakeID", "Name", make.MakeID);
        ViewBag.ModelID = new SelectList(db.Models, "ModelID", "Name", car.ModelID);
        ViewBag.CarLotID = new SelectList(db.CarLots, "CarLotID", "LotName", car.CarLotID);
        return View(car);
    }
        public JsonResult GetModelList(int MakeID)
    {
        db.Configuration.ProxyCreationEnabled = false;
        List<Model> ModelList = db.Models.Where(x => x.MakeID == MakeID).ToList();
        return Json(ModelList, JsonRequestBehavior.AllowGet);
    }

请帮助,谢谢。

1 个答案:

答案 0 :(得分:1)

在MVC中,您尝试创建级联下拉列表。因此,为便于理解,您可以检查以下链接。它包含控制器和View with Jquery部分的详细信息。

请访问此链接:Cascading Drop down List With MVC And AJAX