C# Mvc Web Api 级联列表

Question

这是我的控制器。

    public class DokuzasController : Controller
{
    public ActionResult AddOrEdit()
    {

        DersViewModel model = new DersViewModel();
        schoolEntities sc = new schoolEntities();
        List<ders> dersList = sc.ders.OrderBy(f => f.Ders1).ToList();

        model.DersList = (from s in dersList
                          select new SelectListItem
                          {
                              Text = s.Ders1,
                              Value = s.DersID.ToString()
                          }).ToList();

        model.DersList.Insert(0, new SelectListItem { Value = "", Text = "Select"});

        return View(model);
    }

    [HttpPost]
    public ActionResult AddOrEdit(DersViewModel model)
    {
        if (model.LectureId == 0)
        {
            HttpResponseMessage response = GlobalVariables.LecturesClient.PostAsJsonAsync("dokuzas", model).Result;
            TempData["SuccessMessage"] = "Saved.";
        }
        else
        {
            HttpResponseMessage response = GlobalVariables.LecturesClient.PutAsJsonAsync("dokuzas/" + model.LectureId, model).Result;
            TempData["SuccessMessage"] = "Successful.";
        }
        return RedirectToAction("Index");
    }

    [HttpPost]
    public JsonResult SaatList(int id)
    {
        schoolEntities sc = new schoolEntities();
        List<saat> saatList = sc.saat.Where(f => f.DersID == id).OrderBy(f => f.Saat1).ToList();
        List<SelectListItem> itemList = (from i in saatList
                                         select
                     new SelectListItem
                     {
                         Value = i.SaatID.ToString(),
                         Text = i.Saat1
                     }).ToList();

        return Json(itemList, JsonRequestBehavior.AllowGet);
    }
}

这是我的 AddOrEdit 文件。

@model Mvc.Models.DersViewModel
@{
ViewBag.Title = "AddOrEdit";
}

@using (Html.BeginForm("AddOrEdit", "Dokuzas", FormMethod.Post))
{
@Html.DropDownListFor(m => m.DersID, Model.DersList)
<br /><br />
@Html.DropDownListFor(m => m.SaatID, Model.SaatList)

<br />
<input type="submit" value="Kaydet" class="btn button" />
}

@section scripts{
<script type="text/javascript">
    $(document).ready(function () {
        $("#DersID").change(function () {
            var id = $(this).val();
            var saatList = $("#SaatID");
            saatList.empty();
            $.ajax({
                url: '/Dokuzas/SaatList',
                type: 'POST',
                dataType: 'json',
                data: { 'id': id },
                success: function (data) {
                    $.each(data, function (index, option) {
                        saatList.append('<option value=' + option.Value + '>' 
+ option.Text + '</option>')
                    });
                }
            });
        });
    });
</script>
}

我有一个表，该表包含 Dersadi 和 Dagilimi 属性。我想创建一个级联列表并从 DersList 到 Dersadi 以及从 SaatList 到 Dagilimi 的列表中添加到表中。但是我选择项目并选择提交按钮，我可以提交它，但它在表中添加了 null。它没有添加我从列表中选择的内容。我该如何解决这个问题？

Answer 1

在视图中，您可以使用DropDownList 辅助方法来呈现带有我们设置为Model.DersList 的数据的SELECT 元素。我们还将添加第二个下拉菜单。

    @using (Html.BeginForm("AddOrEdit", "Dokuzas", FormMethod.Post))
    {
    @Html.DropDownList("DersID", Model.DersList as SelectList)
    <select name="id" id="SaatID" data-url="@Url.Action("SaatList","Home")">

    <br />
    <input type="submit" value="Kaydet" class="btn button" />
    }

<script type="text/javascript">
    $(function(){
    $("#DersID").change(function (e) {
        var $SaatID = $("#SaatID");
        var url = $SaatID.data("url")+'?id='+$(this).val();
        $.getJSON(url, function (items) {
            $.each(items, function (a, b) {
                $vacancy.append('<option value="' + b.Value + '">' + b.Text + '</option>');
            });
        });
    });    
});

</script>