Question

我有一个使用本地数据绑定的剑道树

使用我的代码，一切正常。

但是，我正在尝试为生成的项添加自定义属性，例如data-name。

如何使用kendo.data.HierarchicalDataSource？

执行此操作

// bind kendo tree
var treeDataSource = new kendo.data.HierarchicalDataSource({
    data: [{ Id: "id", Text: "Node 1", HasChildren: false, ChildrenFolders: [], HtmlAttributes: { "data-name": "Custom Name" } }],
    schema: {
        model: {
            children: "ChildrenFolders",
            hasChildren: "HasChildren",
            id: "Id",
            htmlAttributes: "HtmlAttributes"
        }
    }
});

this.kendoTreeView = $("#tree").kendoTreeView({
    dataSource: treeDataSource,
    dataTextField: "Text",
    loadOnDemand: false
}).data("kendoTreeView");

Answer 1

您必须替换树视图窗口小部件中的项目模板，遗憾的是，这将替换整个_template方法。我建议手动创建DOM结构（如here所做），这样您就可以在初始化树视图之前设置属性。另一种选择是使用treeview的template选项（在这种情况下，你只能在子元素上添加属性）。

Answer 2

您可以使用dataItem（）获取dataSource项属性，方法将jQuery选择器作为参数：

var treeview = $("#treeview").kendoTreeView({
                        animation: false,
                        dataSource: dataSource,
                        select: function (e) {
                            var dataitem = treeview.dataItem("#treeview_tv_active");
                            //dataitem.HtmlAttributes
                        }
                    }).data("kendoTreeView");

Kendo UI TreeView自定义属性

2 个答案: