Kendo UI 级联 DropdownList 是如何工作的？

Posted 2023-05-07

【中文标题】Kendo UI 级联 DropdownList 是如何工作的？

【英文标题】：How does the Kendo UI cascading DropdownList works?

【发布时间】：2013-02-18 02:43:55

【问题描述】：

谁能给我解释一下这段代码的结构？

例如.Name("products") 是DropDownList 名称，我想知道它们是什么（你怎么称呼它（Name、OptionLabel 等）），因为它真的让我很困惑。我一直在创建级联 DropDownList。

@(html.Kendo().DropDownList()
      .Name("products")
      .OptionLabel("Select product...")
      .DataTextField("ProductName")
      .DataValueField("ProductID")
      .DataSource(source => 
          source.Read(read =>
          
              read.Action("Type", "ComboBox")
                  .Data("filterProducts");
          )
          .ServerFiltering(true);
      )
      .Enable(false)
      .AutoBind(false)
      .CascadeFrom("categories")
)
<script>
    function filterProducts() 
        return 
            categories: $("#categories").val()
        ;
    
</script>

<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("SubType", "ComboBox")
                  .Data("filterOrders");
          )
          .ServerFiltering(true);
      )
      .Enable(false)
      .AutoBind(false)
      .CascadeFrom("products")
)
<script>
    function filterOrders() 
        return 
            products: $("#filterOrders").val()
        ;
    
</script>

【问题讨论】：

您可以在 kendoUI 网站 Here's the Link987654321@ 中查看文档的完整详细信息

【参考方案1】：

.Name("orders")：这是分配给下拉 html 元素的唯一名称。

.OptionLabel("Select order...")：这是在未选择任何选项时应显示的下拉菜单。

.DataTextField("ShipCity")：这是数据源的属性，用于填充应显示在下拉列表中的下拉选项。

.DataValueField("OrderID")：这是绑定数据源的属性，它填充下拉选项，应用作绑定到视图底层模型的值。

read.Action("SubType", "ComboBox")：这定义了应该调用的 Action 和 Controller 以检索将填充下拉选项的集合

.Data("filterOrders")：这个是用来给上面的read.Action方法赋值的

.ServerFiltering(true):

.Enable(false): 下拉菜单是否启用。

.AutoBind(false): 下拉菜单是否应该立即绑定到它的下拉数据源（或者等待下拉菜单的级联被赋值）

.CascadeFrom("products")：要级联的另一个 DropDownList。如果 AutoBind 为 false，则只有在用户为另一个下拉列表分配值后，此下拉列表才会绑定到其选项数据源。

【讨论】：

我遇到了一个问题，即列表未显示在第二个下拉列表中（即使触发了 Controller 操作也始终为空）。 “.ServerFiltering(true);”让它完美运行。

.Enable(true) 和 .Autobind(true) 未按预期工作。我想要一个页面加载的默认列表，它总是被禁用而不是绑定。可能是 Kendo DropDownList 中的错误？

我猜你所说的“默认列表”是什么意思......如果你的意思是一个列表必须总是有一个特定的选项列表，不管其他下拉列表，那么这个下拉列表一定不能级联树的一部分（将其 CascadeFrom 留空/空）