如何将子项添加到TreePanel中的节点?

时间:2012-04-23 05:51:10

标签: javascript extjs extjs4 treepanel

在像这样的树结构中

var rootNode = { 
              id: 'root',
              text : 'Root Node',
    expanded : true,
    children : [
    {
        id :  'c1',
        text : 'Child 1',
        leaf : true
    },
    {
        id :  'c2',
        text : 'Child 2',
        leaf : true
    },
    {
        id :  'c3',
        text : 'Child 3',
        children : [
        {
            id :  'gc1',
            text : 'Grand Child',
            children : [
            {
                id :  'gc11',
                text : 'Grand Child 1',
                leaf : true
            },
            {
                id :  'gc12',
                text : 'Grand Child 2',
                leaf : true
            }
            ]
        }
        ]
    }
    ]
};

var tree = new Ext.tree.TreePanel({
    id: 'treePanel',
    autoscroll: true,
    root: rootNode
});

如何添加任何节点的子节点(比如'grandchild')?

我可以通过遍历treepanel的根来访问孩子,但我在Firebug中登录它,它没有任何功能。 对于未格式化的代码,我无法对其进行格式化。

Tree Panel

1 个答案:

答案 0 :(得分:13)

做这样的事情:

var treeNode = tree.getRootNode();
treeNode.expandChildren(true); // Optional: To see what happens
treeNode.appendChild({
        id: 'c4',
        text: 'Child 4',
        leaf: true
});
treeNode.getChildAt(2).getChildAt(0).appendChild({
        id: 'gc13',
        text: 'Grand Child 3',
        leaf: true
});

如果这是您所需要的,请查看NodeInterface类。它有许多有用的方法: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.NodeInterface