KendoUI级联下拉列表，需要2个下拉列表中的值. [英] KendoUI cascading dropdownlists, need value from 2 dropdownlists.

问题描述

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

I have 3 cascading dropdownlists as follows:

<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()属性中指定的任何值.

The Action in the controller only takes in 1 parameter, which is whatever value that you have specify in the DataValueField() property of the dropdownlist.

但是，对于我的第3个下拉列表，我希望其中的项目依赖于前2个下拉列表，而不仅是前一个.

However, for my 3rd dropdownlist, I want the items in it, to be dependant on BOTH the first 2 dropdownlists, and not just the one prior.

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

How can I get both the selected value of the 1st and 2nd dropdownlist as well from my action?

推荐答案

要在第三个DDL请求其数据时将第一个DDL的值与第二个DDL的值一起发送，您只需将此值添加到<读取请求的strong>数据功能.

To send the value of the first DDL along with the value of the second DDL when the third DDL requests its data you just need to add this value to the Data function of the Read request.

例如

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

还可以更改操作方法签名以增加一个参数

Also change the action method signature to have one more argument

public JsonResult GetCascadeOrders(string categories,string products)

这篇关于KendoUI级联下拉列表，需要2个下拉列表中的值.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！