DropDownTree概述

下拉列表树是Telerik UI for ASP。网络核心，一个具有 110+ 组件的专业级UI库，用于构建现代和功能丰富的 应用程序。想要试用它，可以注册一个30天的免费试用期。

下载免费试用

Telerik UI DropDownTree TagHelper和HtmlHelper。网络核心are server-side wrappers for the Kendo UI DropDownTree widget.

DropDownTree表示一个层次数据的编辑器，以树状结构呈现，它提供了多个选择选项和自定义节点。

• DropDownTree HtmlHelper的演示页面

• 下拉菜单TagHelper的演示页面

初始化下拉列表树

下面的示例演示如何定义下拉列表树。

@(Html.Kendo().DropDownTree() .Name("dropdowntree") .DataTextField("Name") .DataValueField("id") .DataSource(dataSource => dataSource .Read(read => read .Action("Read_DropDownTreeData"， "Home"))))

 < hierarchy -datasource>  < hierarchy -model id="id">       .

公共静态IList < HierarchicalViewModel > GetHierarchicalData () {var =新列表< HierarchicalViewModel >(){新HierarchicalViewModel () {ID = 1, ParentID = null, HasChildren = true, Name = "父项”},新HierarchicalViewModel () {ID = 2, ParentID = 1, HasChildren = true, Name = "父项”},新HierarchicalViewModel () {ID = 3, ParentID = 1, HasChildren = false, Name = "项目"},新HierarchicalViewModel () {ID = 4, ParentID = 2, HasChildren = false, Name = "项目"},new HierarchicalViewModel() {ID = 5, ParentID = 2, HasChildren = false, Name = "Item"}};返回结果;} public IActionResult Read_DropDownTreeData(int?id) {var result = GetHierarchicalData() . where (x => id。HasValue吗?x.ParentID == id: x.ParentID == null) .选择(项目=> new {id =项目。ID, Name = item。名称，hasChildren =项目。HasChildren});返回Json(结果);｝

基本配置

下面的示例演示了下拉列表树的基本配置。

@(Html.Kendo(). dropdowntree (). name ("dropdowntree") . items (dropdowntree => {dropdowntree. add()。文本("我的网站").SpriteCssClasses("文件夹").Expanded(true) .Items(根=> {root. add ().Text("images") .Expanded(true) .SpriteCssClasses("文件夹").Items(images => {images. add ().Text("logo.png") .SpriteCssClasses("image");});root.Add().Text("resources") .Expanded(true) .SpriteCssClasses("folder") .Items(resources => {resources. add ().Text("pdf") .Expanded(true) .SpriteCssClasses("folder") .Items(pdf => {pdf. add ().Text("prices.pdf") .SpriteCssClasses("pdf");});resources.Add()。text (zip) .SpriteCssClasses(“文件夹”);});“about.html”root.Add()。text () .SpriteCssClasses(“html”);root.Add()。text (index . html) .SpriteCssClasses(“html”);}); }) )

< kendoo -dropdowntree name="dropdowntree">                          

功能和特性

• 数据绑定
• 复选框
• 过滤
• 项目
• 模板
• 可访问性

事件

下面的示例演示了可用的DropDownTree事件，以及如何为每个事件实现事件处理程序。

有关基本下拉列表树事件的示例，请参阅演示了如何使用下拉列表树的事件．

@(Html.Kendo().DropDownTree() .Name("dropdowntree") .DataTextField("Name") .DataSource(dataSource => dataSource .Read(read => read .Action("Employees"， "Home"))) .Events(events => events .DataBound("onDataBound") .Change("onChange") .Select("onSelect") .Close("onClose") .Open("onOpen") .Filtering("onFiltering"))))

 < hierarchy -datasource>  < hierarchy -model id="id">