级联下拉菜单asp.net core mvc

时间:2019-05-07 10:49:46

标签: javascript jquery asp.net-core

我正在尝试使用JQuery级联下拉菜单。我创建了两个模型 一个是汽车模型,第二是品牌。 之后,我创建了第三个模型以保证包含ModelID和BrandID

  [Display(Name = "Marka vozila")]
   public int MarkaVozilaID { get; set; }

    [ForeignKey("MarkaVozilaID")]
    public virtual MarkeVozila MarkaVozila { get; set; }

    [Display(Name = "Model vozila")]
    public int ModelVozilaID { get; set; }

    [ForeignKey("ModelVozilaID")]
    public virtual ModeliVozila ModelVozila { get; set; }

因此,当我创建一个Quarantee且用户想要选择汽车品牌时,它应该显示所有模型。在控制器内部,我添加了功能

   [HttpGet]
        public JsonResult GetMarkaById(int MarkaId)
        {
            var markaList = new SelectList(_db.MarkeVozila.Where(c => c.Id == MarkaId), "Id", "Ime");
            return Json(markaList);

        }

然后我添加了用于级联的脚本

<script type="text/javascript">
        $(document).ready(function () {
        var items = "<option value='0'>Select</option>";
        $("#markaVozila").html(items);
    });


    $("#modelVozila").change(function () {
        var modelID = $("#modelVozila").val();
        var url = "/Garancija/GetMarkaById";

        $.getJSON(url, { modelID: modelID }, function (data) {
            var item = "";
            $("#markaVozila").empty();
            $.each(data, function (i, marka) {
                item += '<option value="' + marka.value + '">' + marka.text + '</option>'
            });
            $("#markaVozila").html(item);
        });
    });
</script>


<div class="form-group row">
            <div class="col-3">
                <text>Marka Vozila</text>
            </div>
            <div class="col-5">
                <select asp-for="@Model.Garancija.MarkaVozilaID" id="markaVozila"  asp-items="Model.MarkeVozila.ToSelectListItem(Model.Garancija.MarkaVozilaID)" class="form-control"></select>
            </div>
        </div>

        <div class="form-group row">
            <div class="col-3">
                <text>Model Vozila</text>
            </div>
            <div class="col-5">
                <select asp-for="@Model.Garancija.ModelVozilaID" id="modelVozila"  asp-items="Model.ModeliVozila.ToSelectListItem(Model.Garancija.ModelVozilaID)" class="form-control"></select>
            </div>
        </div>

但是当我运行它时,它什么都不显示 我在哪里弄错了,有人可以帮我吗?

0 个答案:

没有答案