0

我正在使用 fancytree 插件来创建树视图。我的所有数据都通过 ajax 和 json 加载到扩展中。如果用户检查父节点,我也有加载子节点的代码,因为如果该节点没有首先展开,它们在技术上没有加载。

我的问题是,如果您有 3 级深的父子关系,并扩展到 2 级,则不会检查第三级。

本质上我有这样的东西

Parent1
-->Child1
---->Child1-1
---->Child1-2
---->Child1-3
-->Child2

现在,如果您从不展开 parent 并检查它,则所有节点都会被加载并检查。但是,如果您展开父节点 1 以显示子节点 1 和 2,然后检查 parent1,子节点 1-1 到 3 永远不会被加载或检查。这是我必须在检查时加载子节点的代码,我缺少什么。

select: function (event, data) { //here's where I need to load the children for that node, if it has them, so they can be set to checked


    var node = data.node;
                        //alert(node.key);
                        if (node.isSelected()) {
                            if (node.isUndefined()) {

                                // Load and select all child nodes
                                node.load().done(function () {
                                    node.visit(function (childNode) {

                                        childNode.setSelected(true);
                                    });
                                });
                            } else {
                                // Select all child nodes
                                node.visit(function (childNode) {

                                    childNode.setSelected(true);
                                });
                            }
                            // Get a list of all selected nodes, and convert to a key array:
                            var selKeys = $.map(data.tree.getSelectedNodes(), function (node) {

                                treeHash[node.data.treeItemType + node.key] = node.key;
                            });

                        }

这是我的完整JS仅供参考

if ($("entityTree") != null) {
            $(function () {
                // Create the tree inside the <div id="tree"> element.
                $("#entityTree").fancytree({
                    source: { url: "/Home/GetTreeViewData", cache: true }
                    , checkbox: true
                    , icons: false
                    , cache: true
                    , lazyLoad: function (event, data) {
                        var node = data.node;
                        data.result = {
                            url: "/Home/GetTreeViewData/" + node.key.replace(node.data.idPrefix, "")
                            , data: { mode: "children", parent: node.key }
                            , cache: true
                        };
                    }
                    , renderNode: function (event, data) {
                        // Optionally tweak data.node.span
                        var node = data.node;

                        var $span = $(node.span);
                        if (node.key != "_statusNode") {

                            $span.find("> span.fancytree-expander").css({
                                borderLeft: node.data.customLeftBorder
                                //borderLeft: "1px solid orange"
                            });
                        }
                    }
                    , selectMode: 3
                    , select: function (event, data) { //here's where I need to load the children for that node, if it has them, so they can be set to checked
                        var node = data.node;
                        //alert(node.key);
                        if (node.isSelected()) {
                            if (node.isUndefined()) {

                                // Load and select all child nodes
                                node.load().done(function () {
                                    node.visit(function (childNode) {

                                        childNode.setSelected(true);
                                    });
                                });
                            } else {
                                // Select all child nodes
                                node.visit(function (childNode) {

                                    childNode.setSelected(true);
                                });
                            }
                            // Get a list of all selected nodes, and convert to a key array:
                            var selKeys = $.map(data.tree.getSelectedNodes(), function (node) {

                                treeHash[node.data.treeItemType + node.key] = node.key;
                            });

                        }
                        else {
                            delete treeHash[node.data.treeItemType + node.key];
                            //alert("remove " + node.key);
                        }
                        for (var i in treeHash) {
                            alert(treeHash[i]);
                        }

                    }
                    , strings: {
                        loading: "Grabbing places and events…",
                        loadError: "Load error!"
                    },
                })
            });
        }
4

1 回答 1

0

试试这个,让我知道是否有效。我们需要加载已经加载的子节点的未定义子节点。

       if (node.isSelected()) {
            if (node.isUndefined()) {

                // Load and select all child nodes
                node.load().done(function () {
                    node.visit(function (childNode) {

                        childNode.setSelected(true);
                    });
                });
            } else {
                // Select all child nodes
                node.visit(function (childNode) {

                    childNode.setSelected(true);
                    if (childNode.isUndefined()) {

                        // Load and select all child nodes
                        childNode.load().done(function () {
                            childNode.visit(function (itschildNode) {
                                itschildNode.setSelected(true);
                            });
                        });
                    }
                });
            }
        }
于 2018-05-23T07:49:14.177 回答