如何以编程方式选择 Kendo UI 树视图的根节点答案

【问题标题】：How to programmatically select the root node of Kendo UI treeview如何以编程方式选择 Kendo UI 树视图的根节点
【发布时间】：2014-02-18 14:48:44
【问题描述】：

我是剑道 UI 新手。我的 Asp.net MVC 应用程序有一个 Kendo UI 树视图，其设置如下。每个树节点都有一个唯一的 ID（例如 EmployeeId，它是整数）。如何以编程方式选择 Kendo UI 树视图的根节点（其 Id 为 1）并且根节点的背景颜色应突出显示？感谢您的帮助。

           var _root = new kendo.data.HierarchicalDataSource({
                transport: {
                    read: {
                        cache: false,
                        url: "/Employee/GetEmployees",
                        dataType: "json",
                        data: { employeeId: _selectedId}
                    }
                },
                schema: {
                    model: {
                        id: "Id",
                        hasChildren: "HasChildren",
                        expanded: "expanded",
                        parentId: "parentId",
                        ItemType: "ItemType"
                    }
                }
            });

            _tree = $("#treeView").kendoTreeView({
                dataSource: _root,
                dataTextField: "Name",
                loadOnDemand: true,                
                dataImageUrlField: "Image",
                dataBound: function (e) {
                    handleTreeDataBound(e);
                },
                select: function (e) {
                    handleSelect(e.node);
                }
            });

            treeViewCtrl = $("#treeView").data("kendoTreeView");

【问题讨论】：

标签： kendo-ui kendo-treeview

【解决方案1】：

你也可以使用这段小代码：

treeview.select($('.k-item:first'));

这将选择根节点。您也可以使用以下方法扩展它：

treeview.expand($('.k-item:first'));

【讨论】：

【解决方案2】：

使用树视图的select 方法，这是您选择第一个节点的方式：

treeViewCtrl.select($("#treeView").find(".k-item").first());

如果您有多个根节点，则必须使用dataItem 方法获取数据项并将其 id 与您要选择的项进行比较。

【讨论】：

非常感谢，您的代码运行良好。

【解决方案3】：

如果您有多个根节点，另一种获取所有根节点的方法是使用 CSS 选择器获取 treeview ul 的直接子节点 li。从那里，您可以获得每个根的dataItem。

$("#treeview").find("ul > li").each(function () {
     var dataItem = treeView.dataItem($(this));
     console.log(dataItem.text);
});

【讨论】：