Question

我使用Extjs 3.4。我正在使用复选框解决方案在TreePanel上工作。

我需要的是：当我检查父节点时，所有的childNodes也被检查。这很简单，但它取决于extjs扩展所有childNodes。

如果我这样做

tree.expandAll();
tree.collapseAll();

我的检查策略可行，但我不想扩展效果。

我的extjs代码（checkchange event）如下所示：

var checkchange = function(node, flag) {

        if (node.hasChildNodes()) {
            node.cascade(function(node) {
                node.attributes.checked = flag;
                node.ui.checkbox.checked = flag;
                return true;
            });
        }

        var pNode = node.parentNode;
        for (; pNode != null; pNode = pNode.parentNode) {
            if (flag || tree.getChecked("checked", pNode).length - 1 == 0) {
                pNode.attributes.checked = flag;
                pNode.ui.checkbox.checked = flag;
            }
        }
    };

var tree = new Ext.tree.TreePanel({

    listeners: {
        'checkchange': checkchange
    },
})

我该怎么办？感谢每一位提供建议。

[编辑]

我创建A Demo In jsfiddle，可以轻松测试。

（由于Extjs 3.4.0 cdn使用的jsfiddle不起作用，我追加来自https://cdnjs.com/libraries/extjs/3.4.1-1的另一个cdn extjs资源）

Answer 1

我不确定您是否确实希望在检查根节点时逐个节点地加载整个树。我建议通过附加到.objectValue事件来延迟检查已经检查过的父节点的子节点。像这样：

@NSCopying var objectValue: AnyObject?

根据您的进一步处理意图和树木大小，这可能比扩展整个树以渲染和检查所有复选框更好。

如果您希望直接加载树，我建议在TreeLoader上使用preloadChildren:true。这比级联负载的手动实现更容易。

Answer 2

我没有真正解决这个问题。但我得到了折衷的解决方案。

仅在需要时展开

checkchange : function(node, flag){

    node.cascade(function(node) {
        // when you check, first expand, then child nodes can be checked too
        if(node.expanded == false)
            node.expand(true);
        node.attributes.checked = flag;
        node.ui.checkbox.checked = flag;
        return true;
    });
    ......
}

这将满足所有子节点应该扩展的前提条件。但是首次加载时也不需要扩展。

如果在首次加载时检查了父节点，则需要展开所有子节点

this.treeLoader = new Ext.tree.TreeLoader({
    url : 'xxx',
    baseParams  : {
        someparam: ""
    },
    listeners : {
        'load' : function(tree,node,response) {
            var res = Ext.util.JSON.decode(response.responseText);
            if(res.success != undefined && !res.success) {
                Ext.Msg.alert('Hint', res.message);
                return;
            }
            node.cascade(function(node) {
                if(node.attributes.checked == true) {
                    node.expand(true);
                }
            });
        },

    }
});

这两种方法确实解决了我的问题，虽然不是很完美。

希望这可以帮助他人。

extjs treepanel加载子项而不扩展

2 个答案: