5

我知道在 Kendo 树视图中找到嵌套节点的确切路径。所以我希望扩展这条路线上的所有节点以到达那里。我知道如何找到一个节点并使 Kendo 扩展该节点。

我的 Treeview 对其数据使用 web-api 并且一切正常。架构定义如下：

            schema: {
                model: {
                    id: "CodeList",
                    hasChildren: "HasKids"
                }
            }

我想要实现的是树自动扩展到嵌套级别。假设我知道到达节点的路径是“Level1CodeA|Level2CodeA|Level3CodeA”，所以首先我希望找到我可以做的代码“Level1CodeA”。
然后我希望展开这个节点（在内部它检索这个节点下的数据并展开 ok），然后我想找到“Level2CodeA”，重复这个过程，然后找到然后选择 Level3CodeA。

我该怎么办？我正在寻找一个“AfterExpanded”事件，我可以用它来开始下一次搜索和展开操作，但我找不到任何可以使用的事件。我在我的数据源上尝试了“更改”事件，但这被触发了很多次，我似乎无法将其缩小到正确的项目..

非常感谢。

编辑：更多代码

<script id="treeII-template" type="text/kendo-ui-template">
    <img id="explorerItemImg" src="#: item.Image #" />
    <span id="explorerItemCode">#: item.Code #</span> - 
    <span id="explorerItemFullName">#: item.FullName #</span>
    # if (item.Level < (item.Levels - 1)) { #
        [<span id="explorerItemLCount">#: item.LCount #</span>]
    # } #
    # if (item.HasKids) { #
        [<span id="explorerItemPCount">#: item.PCount #</span>]
    # } #

</script>

创建 HierarchicalDataSource 并将其分配给树视图的代码：

    // -----------------
    // set the datasource for the bottom explorer...
    // -----------------
    var loadDataForExplorerGroup = function (context, groupid, groupsequence) {

        // hang on to this context/groupid
        sessionStorage.setItem(context + "_explorer_groupId", groupid);
        sessionStorage.setItem(context + "_explorer_groupSequence", groupsequence);

        // define the datasource and attach it to the explorer-tree
        explorerGroupData = new kendo.data.HierarchicalDataSource({
            transport: {
                read: {
                    url: "/api/explorerapi/GetExplorerData?",
                    data: {
                        context: "portfolio",
                        groupid: groupid,
                        groupsequence: groupsequence,
                        userid: sessionStorage.getItem("symUserID")
                    }
                }
            },
            schema: {
                model: {
                    id: "CodeList",
                    hasChildren: "HasKids"
                }
            }
        });

        // simply assign the data source again to the tree
        $("#idExplBottomTree").data("kendoTreeView").setDataSource(explorerGroupData);

    };
4

1 回答 1

6

那个AfterExpanded事件可能是dataBound。我建议给出以下TreeView定义：

var tree = $("#treeview").kendoTreeView({
    dataSource   : data,
    dataTextField: "text",
    dataBound    : function (e) {
        treeNavigateNext();
    }
}).data("kendoTreeView");

我添加dataBound了调用treeNavigate定义为的处理程序：

function treeNavigateNext() {
    if (search.length > 0) {
        var first = tree.findByText(search[0]);
        if (first) {
            search.shift();
            tree.expand(first);
        }
    }
}

where是包含我们要导航的每个节点search的数组。dataTextField

例子：

search = [];
search.push("t_3");
search.push("t_32");
search.push("t_321");
search.push("t_3214");

定义我们想要expand一个节点，其中文本是t_3，然后t_32，下一个t_321，最后t_3214。

因此treeNavigateNext检查是否还有待处理的东西 ( search.length > 0)，如果是，则通过 ( ) 找到元素，从text( )var first = tree.findByText(search[0]);中删除元素，最后从节点 ( search)中删除。这会导致下一个级别被加载，当接收到的事件被触发时，我将进入下一个级别。search.shift();expandtree.expand(first)dataBound

看到它在这里运行

编辑：如果不是通过文本搜索，您更喜欢导航id然后添加到不同节点的search数组id并使用以下treeNavigateNext函数：

function treeNavigateNext() {
    if (search.length > 0) {
        var first = tree.dataSource.get(search[0]);
        if (first) {
            search.shift();
            var elem = tree.findByUid(first.uid);
            tree.expand(elem);
        } 
    }
}

新的运行示例在这里

于 2013-01-17T23:46:51.967 回答