C# ASP.NET MVC级联下拉列表_C#_Jquery_Asp.net Mvc_Drop Down Menu_Dropdown

C# ASP.NET MVC级联下拉列表

c# jquery asp.net-mvc drop-down-menu

C# ASP.NET MVC级联下拉列表,c#,jquery,asp.net-mvc,drop-down-menu,dropdown,C#,Jquery,Asp.net Mvc,Drop Down Menu,Dropdown,我的数据库中有三个表，如下所示： University id Name 1 A 2 B Faculty id id_uni name 1 1 AA 2 1 AA cafedry id id_uni id_faculty name 1 1 1 cc 我想创建一个级联下拉列表，它允许我首先选择一所大学，然后选择一个教员，然后选择一个咖啡馆。下面的代

我的数据库中有三个表，如下所示：

University 
 id   Name
 1     A
 2     B

Faculty 
id   id_uni   name
1      1       AA
2      1       AA

cafedry
id    id_uni    id_faculty   name

1       1            1        cc

我想创建一个级联下拉列表，它允许我首先选择一所大学，然后选择一个教员，然后选择一个咖啡馆。下面的代码是我迄今为止尝试过的代码

 public ActionResult Create()
    {
        ViewBag.fak_kod = new SelectList(db.Fakulteler, "id", "adi");
        ViewBag.unikod = new SelectList(db.Universitetler, "id", "adi");
        return View();
    }

    // POST: kafedras/Create
    // To protect from overposting attacks, please enable the specific properties you want to bind to, for 
    // more details see http://go.microsoft.com/fwlink/?LinkId=317598.
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create([Bind(Include = "id,unikod,fak_kod,adi")] kafedra kafedra)
    {
        if (ModelState.IsValid)
        {
            db.kafedra.Add(kafedra);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        ViewBag.fak_kod = new SelectList(db.Fakulteler , "id", "adi", kafedra.fak_kod);
        ViewBag.unikod = new SelectList(db.Universitetler, "id", "adi", kafedra.unikod);
        return View(kafedra);
    }

这是cshtml

<div class="form-horizontal">
    <h4>kafedra</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        @Html.LabelFor(model => model.unikod, "unikod", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("unikod", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.unikod, "", new { @class = "text-danger" })
        </div>
    </div>

    <div class="form-group">
        @Html.LabelFor(model => model.fak_kod, "fak_kod", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("fak_kod", null, htmlAttributes: new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.fak_kod, "", new { @class = "text-danger" })
        </div>
    </div>


卡非德拉

@Html.ValidationSummary（true，“，new{@class=“text danger”}）
@LabelFor（model=>model.unikod，“unikod”，htmlAttributes:new{@class=“controllabel col-md-2”}）
@DropDownList（“unikod”，null，htmlAttributes:new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.unikod，“，new{@class=“text danger”}）
@LabelFor（model=>model.fak_kod，“fak_kod”，htmlAttributes:new{@class=“control label col-md-2”}）
@DropDownList（“fak_kod”，null，htmlAttributes:new{@class=“form control”}）
@Html.ValidationMessageFor（model=>model.fak_kod，“，new{@class=“text danger”}）

如何更新此代码以创建三个表的级联下拉列表？

首先，创建一个视图模型，该模型具有呈现选项和存储选定项值的属性

public class CreateVm
{
   [Required]
   public int SelectedUniversity { set;get;}

   [Required]
   public int SelectedFaculty { set;get;}  

   public List<SelectListItem> Universities { set;get;}    
   public List<SelectListItem> Faculties { set;get;}

   public CreateVm()
   {
       this.Faculties = new List<SelectListItem>();
       this.Universities = new List<SelectListItem>();
   }  
}

现在在您的视图中，它是我们的

CreateVm

视图模型的强类型。我们将使用

DropDownListFor

helper方法呈现下拉列表

@model CreateVm
@using (Html.BeginForm("Create", "Home"))
{
   @Html.DropDownListFor(a=>a.SelectedUniversity,Model.Universities,"Select one")
   @Html.DropDownListFor(a => a.SelectedFaculty , Model.Faculties, "Select one",
                                       new { data_url = Url.Action("GetFaculties") })
   <input type="Submit" />
}

现在，让我们添加一个

GetFaculties

操作方法，该方法接受大学id，并将该大学的学院作为JSON数组返回到

SelectListItem

列表中

public ActionResult GetFaculties(int u)
{
    var facultyList = db.Fakulteler
                        .Where(a=>a.id_uni==u)
                        .Select(x=>new SelectListItem { Value=x.Id,
                                                       Text=x.Name).ToList();
    return Json(facultyList , JsonRequestBehavior.AllowGet);
}

您可以在HttpPost操作中使用相同的视图模型

[HttpPost]
public ActionResult Create(CreateVm vm)
{
    if (ModelState.IsValid)
    {
        //read from vm and save
        var k=new kafedra { 
                           UniveristyId=vm.SelectedUniversity, 
                           FacultyId=vm.SelectedFaculty, 
                        };
        db.kafedra.Add(k);
        db.SaveChanges();
        return RedirectToAction("Index");
    }
    vm.Universities= GetUniversities();
    return View(vm);
}

首先，创建一个视图模型，该模型具有用于渲染选项和存储选定项值的属性

public class CreateVm
{
   [Required]
   public int SelectedUniversity { set;get;}

   [Required]
   public int SelectedFaculty { set;get;}  

   public List<SelectListItem> Universities { set;get;}    
   public List<SelectListItem> Faculties { set;get;}

   public CreateVm()
   {
       this.Faculties = new List<SelectListItem>();
       this.Universities = new List<SelectListItem>();
   }  
}