Kendo MVC 级联下拉列表问题

Question

我正在使用 Kendo UI ASP.NET MVC，我想用它做一个级联下拉列表。我在第三个下拉列表中遇到问题，它显示了数据库中的所有值，而不是第二个下拉列表中选择的 id 值。

我的控制器代码：-

public ActionResult CDropdown()
{
    return View();
}
public JsonResult GetCascadeDept()
{
    return Json(db.DeptData.Select(c => new { DepartmentID = c.DepartmentID, DepartmentName = c.DepartmentName }), JsonRequestBehavior.AllowGet);
}

public JsonResult GetCascadeEmployee(int? Departmets)
{
    var empdata = db.EmpData.AsQueryable();
    if (Departmets != null)
    {
        empdata = empdata.Where(p => p.DepartmentID == Departmets);
    }
    return Json(empdata.Select(p => new { EmployeeID = p.EmployeeID, EmpName = p.EmpName }), JsonRequestBehavior.AllowGet);
}

public JsonResult GetCascadeMovies(int? Employees)
{
    var d = from c in db.EmpMovies orderby c.MovieName select c;
    var moviedata = db.EmpMovies.AsQueryable();
    if (Employees != null)
    {
        int cat = Convert.ToInt32(Employees);
        moviedata = moviedata.Where(p => p.EmployeeID == Employees);
    }
    return Json(moviedata.Select(p => new { MovieId = p.MovieId, MovieName = p.MovieName }), JsonRequestBehavior.AllowGet);
}

我的查看代码：-

<div>
    <p>
        <label for="Departmets">Department :- </label>
        @(Html.Kendo().DropDownList()
              .Name("Departmets")
              .HtmlAttributes(new { style = "width:300px" })
              .OptionLabel("-- Select Department --")
              .DataTextField("DepartmentName")
              .DataValueField("DepartmentID")
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("GetCascadeDept", "Home");
                      //.Data("FilterDepartmets");
                  })
                  .ServerFiltering(true);
              })
              .SelectedIndex(0)
        )
    </p>
    <p>
        <label for="Employees">Employee :- </label>
        @(Html.Kendo().DropDownList()
              .Name("Employees")
              .HtmlAttributes(new { style = "width:300px" })
              .OptionLabel("-- Select Employee --")
              .DataTextField("EmpName")
              .DataValueField("EmployeeID")
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("GetCascadeEmployee", "Home")
                      .Data("FilterEmployees");
                  })
                  .ServerFiltering(true);
              })
              .Enable(false)
              .AutoBind(false)
              .SelectedIndex(0)
              .CascadeFrom("Departmets")
        )
        <script type="text/javascript">
            function FilterEmployees() {
                return {
                    Departmets: $("#Departmets").val()
                };
            }
        </script>
    </p>
    <p>
        <label for="Movies">Movie Names :- </label>
        @(Html.Kendo().DropDownList()
              .Name("Movies")
              .HtmlAttributes(new { style = "width:300px" })
              .OptionLabel("-- Select Movie --")
              .DataTextField("MovieName")
              .DataValueField("MovieId")
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("GetCascadeMovies", "Home")
                      .Data("FilterMovies");
                  })
                  .ServerFiltering(true);
              })
              .Enable(false)
              .AutoBind(false)
              .SelectedIndex(0)
              .CascadeFrom("Employees")
        )

        <script type="text/javascript">
            function FilterMovies() {
                return {
                    Movies: $("#FilterMovies").val()
                };
            }
        </script>
    </p>
</div>

我正在使用 Kendo UI ASP MVC 下拉列表 - 第三个下拉列表显示 Table 中的所有值 - 未获取 ID。我不知道为什么会这样。有什么解决办法吗？

Answer 1

您的 FilterMovies 功能有误。您想按所选员工过滤电影，因此函数应如下所示（注意不同的属性名称Movies -> Employees，和不同的 $ 选择器 "#FilterMovies" -> "#Employees"):

function FilterMovies() {
    return {
        Employees: $("#Employees").val()
    };
}

希望对您有所帮助。

Answer 2

刚刚更改了视图中的第三个下拉列表:-

<p>
    <label for="Movies">Movie Names :- </label>
    @(Html.Kendo().DropDownList()
          .Name("Movies")
          .HtmlAttributes(new { style = "width:300px" })
          .OptionLabel("-- Select Movie --")
          .DataTextField("MovieName")
          .DataValueField("MovieId")
          .DataSource(source =>
          {
              source.Read(read =>
              {
                  read.Action("GetCascadeMovies", "Home")
                  .Data("FilterMovies");
              })
              .ServerFiltering(true);
          })
          .Enable(false)
          .AutoBind(false)
          .SelectedIndex(0)
          .CascadeFrom("Employees")
    )
    <script type="text/javascript">
        function FilterMovies() {
            return {
                Employees: $("#Employees").val()
            };
        }
    </script>
</p>

Kendo MVC 级联下拉列表问题

Kendo MVC Cascading Dropdownlist Issue

asp.net-mvc

cascadingdropdown

asp.net-mvc-4

kendo-asp.net-mvc