Kendo UI Treeview

本文介绍了Kendo UI Treeview-与分层数据绑定的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

很抱歉问一个基本问题，我是第一次使用Kendo UI.

Sorry for asking basic question, I am using Kendo UI first time.

我的问题是:

我有从SQL Server通用类型表达式(CTE)返回的分层数据，格式如下:

I have hierarchical data returned from SQL Server Common Type Expression (CTE) in below format

Id ParentId名称

Id ParentId Name

1 0名称-1(0级)

1 0 Name-1 (Level 0)

2 0名称2(0级)

2 0 Name-2 (Level 0)

3 1名称3(1级)

3 1 Name-3 (Level 1)

4 3 Name-4(2级)

4 3 Name-4 (Level 2)

以此类推...

我需要将此数据绑定到Kendo UI Tree View控件.我在Kendo UI文档中看到的所有示例都处理硬编码数据，然后有HierachicalDataSoruce示例，但是在这些示例中，手动创建了分层Json对象(使用电影示例).我确定会有某种方法直接将Kendo UI控件(树视图或网格)与层次结构数据绑定，只是我没有得到它.

I need to bind this data to Kendo UI Tree View control. All the samples I saw in Kendo UI docs deals with hard coded data and then there is HierachicalDataSoruce examples but in those examples hierarchical Json object is manually created (using a movie example). I am sure there would be some way to bind Kendo UI controls (tree view or grid) with hierarchical data directly, just I am not getting it.

如果有人遇到类似情况或了解一些情况，请让我知道如何处理这种情况.

If anyone comes across similar situation or know something then please let me know how to deal with this situation.

谢谢

推荐答案

您需要以Kendo的数据源支持的格式提供数据，例如一个JavaScript数组；对于树视图，数组中的每个对象(至少)将需要具有一个包含要显示的文本的属性(默认为item.text)和一个包含子节点数组的属性(默认为item.items)

You'll need to provide the data in a format supported by Kendo's DataSource, e.g. a JavaScript array; in case of a treeview, each object in the array will (at minimum) need to have a property containing the text to display (item.text by default) and a property which contains an array of child nodes (item.items by default).

您可以在服务器端或客户端上转换数据，但是最终，您必须定义如何在某处解释数据，以便Treeview小部件可以呈现它.

You can either transform your data on the server-side, or on the client-side, but ultimately, you'll have to define how to interpret your data somewhere so the treeview widget can render it.

您可以使用以下方法重新映射其中一些字段 Kendo TreeView配置，例如文本字段:

You can remap some of those fields using the Kendo TreeView configuration, e.g. the text field:

$("#treeview").kendoTreeView({ dataTextField: "Name", dataSource: items });

对于其他人，您可以使用该架构数据源配置的模型(另请参见 Model.define )，或者如果您需要其他逻辑来映射现有项目属性，则可以使用 schema.parse .

For others, you can use the schema model of your data source configuration (also see Model.define), or if you need additional logic to map your existing item properties, you can use schema.parse.