Question

enter image description here我正在尝试使用带有复选框的树视图来定义用户权限。（2个动作 - 启用/禁用权限）如何从父节点获取值（id）？

Answer 1

请尝试使用以下代码段。

<!DOCTYPE html>
<html>
<head>
    <title>Jayesh Goyani</title>
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.default.min.css">
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.mobile.all.min.css">

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2015.3.1111/js/angular.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2015.3.1111/js/jszip.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.all.min.js"></script>
</head>
<body>
    <div id="treeview"></div>
    <p id="result">No nodes checked.</p>
    <script>
        $(document).ready(function () {
            $("#treeview").kendoTreeView({
                checkboxes: {
                    checkChildren: true
                },

                check: onCheck,

                dataSource: [{
                    id: 1, text: "1", expanded: true, items: [
                        {
                            id: 2, text: "2", expanded: true, items: [
                                { id: 3, text: "3" },
                                { id: 4, text: "4" },
                                { id: 5, text: "5" }
                            ]
                        },
                        {
                            id: 6, text: "6", expanded: true, items: [
                                { id: 7, text: "7" },
                                { id: 8, text: "8" },
                            ]
                        },
                        {
                            id: 9, text: "9", expanded: true, items: [
                                { id: 10, text: "10" },
                                { id: 11, text: "11" },
                                { id: 12, text: "12", expanded: true, items: [{ id: 13, text: "13", expanded: true, items: [{ id: 14, text: "14" }, { id: 15, text: "15" }] }] }
                            ]
                        }
                    ]
                }]
            });
        });
        // function that gathers IDs of checked nodes
        function checkedNodeIds(nodes, checkedNodes) {
            for (var i = 0; i < nodes.length; i++) {
                if (nodes[i].checked) {
                    getParentIds(nodes[i], checkedNodes);
                    checkedNodes.push(nodes[i].id);
                }

                if (nodes[i].hasChildren) {
                    checkedNodeIds(nodes[i].children.view(), checkedNodes);
                }
            }
        }

        function getParentIds(node, checkedNodes) {
            if (node.parent() && node.parent().parent() && checkedNodes.indexOf(node.parent().parent().id) == -1) {
                getParentIds(node.parent().parent(), checkedNodes);
                checkedNodes.push(node.parent().parent().id);
            }
        }

        // show checked node IDs on datasource change
        function onCheck() {
            var checkedNodes = [],
                treeView = $("#treeview").data("kendoTreeView"),
                message;

            checkedNodeIds(treeView.dataSource.view(), checkedNodes);

            if (checkedNodes.length > 0) {
                message = "IDs of checked nodes: " + checkedNodes.join(",");
            } else {
                message = "No nodes checked.";
            }

            $("#result").html(message);
        }
    </script>
</body>
</html>

如果有任何疑虑，请告诉我。

Answer 2

此示例将返回所选节点的父ID。

treeView.select().parentNode().id;

如果您需要查找特定节点的父节点，则必须在select()函数中指定一个选择器：treeView.select($("search criteria"))

如果你想在父母中循环，你可以这样做

var parentNode = treeView.select().parentNode();
while (parentNode) {
    //Add your parent logic here
    //...

    parentNode = parent.parentNode();
}

选中Kendo Treeview检查子节点上的父节点

2 个答案: