2

我有 3 个级联下拉列表,如下所示:

<p>
    <label for="categories">Catergories:</label>
    @(Html.Kendo().DropDownList()
          .Name("categories")
          .OptionLabel("Select category...")
          .DataTextField("CategoryName")
          .DataValueField("CategoryId")
          .DataSource(source => {
               source.Read(read => {
                   read.Action("GetCascadeCategories", "ComboBox");
               });
          })
    )
</p>
<p>
    <label for="products">Products:</label>
    @(Html.Kendo().DropDownList()
          .Name("products")
          .OptionLabel("Select product...")
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetCascadeProducts", "ComboBox")
                      .Data("filterProducts");
              })
              .ServerFiltering(true);
          })
          .Enable(false)
          .AutoBind(false)
          .CascadeFrom("categories")
    )
    <script>
        function filterProducts() {
            return {
                categories: $("#categories").val()
            };
        }
    </script>
</p>
<p>
    <label for="orders">Orders:</label>
    @(Html.Kendo().DropDownList()
          .Name("orders")
          .OptionLabel("Select order...")
          .DataTextField("ShipCity")
          .DataValueField("OrderID")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetCascadeOrders", "ComboBox")
                      .Data("filterOrders");
              })
              .ServerFiltering(true);
          })
          .Enable(false)
          .AutoBind(false)
          .CascadeFrom("products")
    )
    <script>
        function filterOrders() {
            return {
                products: $("#filterOrders").val()
            };
        }
    </script>
</p>

这是控制器的样子:

    public JsonResult GetCascadeCategories()
    {
        var northwind = new NorthwindDataContext();

        return Json(northwind.Categories.Select(c => new { CategoryId = c.CategoryID, CategoryName = c.CategoryName }), JsonRequestBehavior.AllowGet);
    }

    public JsonResult GetCascadeProducts(string categories)
    {
        var northwind = new NorthwindDataContext();
        var products = northwind.Products.AsQueryable();

        if (!string.IsNullOrEmpty(categories))
        {
            products = products.Where(p => p.CategoryID.ToString() == categories);
        }

        return Json(products.Select(p => new { ProductID = p.ProductID, ProductName = p.ProductName}), JsonRequestBehavior.AllowGet);
    }

控制器中的 Action 仅接受 1 个参数,即您在下拉列表的 DataValueField() 属性中指定的任何值。

但是,对于我的第三个下拉列表,我希望其中的项目依赖于前两个下拉列表,而不仅仅是前一个。

如何从我的操作中同时获取第一个和第二个下拉列表的选定值?

4

1 回答 1

4

要在第三个 DDL 请求其数据时将第一个 DDL 的值与第二个 DDL 的值一起发送,您只需将此值添加到读取请求的数据函数中。

例如

<script>
    function filterOrders() {
        return {
            categories: $("#categories").val(),
            products: $("#filterOrders").val()
        };
    }
</script>

还将操作方法​​签名更改为多一个参数

public JsonResult GetCascadeOrders(string categories,string products)
于 2012-11-29T21:25:05.967 回答