单击父级时检查树的子节点[ExtJS]答案

【问题标题】：check child nodes of a tree when a parent is clicked [ExtJS]单击父级时检查树的子节点[ExtJS]
【发布时间】：2010-02-16 07:13:00
【问题描述】：

我想知道如何在单击 ExtJs 中的特定节点时检查树的兄弟节点。

我已经为每个节点提供了 id，我可以访问被点击节点的 id。那么我该如何继续自动检查子节点？？

有人请帮帮我..

【问题讨论】：

标签： extjs tree extjs3

【解决方案1】：

// or any other way of getting hands on the node you want to work with
var node = treePanel.getNodeById('your-id');
node.eachChild(function(n) {
    n.getUI().toggleCheck(true);
});

如果你想让它在当前节点的整个子树上工作，你必须做一些递归。

更集成一点：

treePanel.on('checkchange', function(node, checked) {
    node.eachChild(function(n) {
        n.getUI().toggleCheck(checked);
    });
});

【讨论】：

在较新的 API 版本中不起作用。成功了stackoverflow.com/questions/6579769/…
没错。上面的代码是针对 Ext JS 3 的，Ext JS 4 对树 API 的改动很大。
因此，如果您不展开子节点，它们将不会加载。因此，当您调用 checkchange 时，它只会检查已加载的子节点。我最终做的是添加 node.expand(true);在 node.eachChild 之前，因此它会扩展所有节点，然后将它们全部检查。
我遇到以下错误：“超出最大调用堆栈大小”

【解决方案2】：

function nodeCheck(node) {
    node.eachChild(function(n) {
        if(n.hasChildNodes())
            nodeCheck(n)
        n.getUI().toggleCheck(false);
    });
}
var node = (tree.getSelectionModel().getSelectedNode()) ? tree.getSelectionModel().getSelectedNode() : tree.root;
if(node) nodeCheck(node);

它对我很有效；）

【讨论】：

工作正常！至少在 Chrome 中我没有以下错误：“超出最大调用堆栈大小”=)

【解决方案3】：

听众：{

checkchange : function(node, checked) {
    node.parentNode.cascadeBy(function(n){n.set('checked', checked);});
}

}

【讨论】：

【解决方案4】：

function checkChange(node, checked, Object) {
    node.cascadeBy(function(n) {
        n.set('checked', checked);
    });
}

【讨论】：

一些简短的解释会很有帮助。

【解决方案5】：

C 先生的答案工作正常（ExtJS 4.2），但是当父节点的子节点有 1 个子节点时会出现错误。这是我的一点改进。有人可以进一步改进

function (node, checked) {

    if (node.isLeaf()) {
        node = node.parentNode;
        var siblingStateEqual = true;
        if (node.childNodes.length == 1) {
            siblingStateEqual = checked;
        } else {
            node.cascadeBy(function (n) {
                if (n != node) {
                    if (n.get('checked') != checked) {
                        siblingStateEqual = false;
                    }
                }

            });
        }

        if (siblingStateEqual == checked) {
            node.set('checked', checked);
        }

    }
    else {
        node.cascadeBy(function (n) {
            n.set('checked', checked);
        });
    }
}

【讨论】：

【解决方案6】：

当您填充节点时，JSON 或 XML 需要将“checked”属性设置为 true 或 false。我假设您正在使用 AsyncTreeNode 为您执行此操作。如果创建树节点时不存在此选中属性，ExtJS 将不会使用复选框呈现它。

【讨论】：

【解决方案7】：

或者，如果像我一样，当所有子叶节点都被选中/取消选中时，你需要自动选中/取消选中父节点，你可以试试这个：

function (node, checked)
{

    if (node.get('leaf'))
    {
        node = node.parentNode;
        var siblingStateEqual = true;
        node.cascadeBy(function (n)
        {
            if (n != node) {
                if (n.get('checked') != checked) {
                    siblingStateEqual = false;
                }
            }

        });

        if (siblingStateEqual == checked)
        {
            node.set('checked', checked);
        }

    }
    else
    {
        node.cascadeBy(function (n) { n.set('checked', checked); });
    }


}

【讨论】：