How to add a child to a node in a TreePanel?

In a tree structure like this

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 }); 

How to add a node child of any node (say, "grandson")?

I can access the child by going through the root of the tree, but I console it in Firebug, it has no functions. Sorry for the unformatted code, I could not format it.

Tree panel

+6
source share
2 answers

Do something like this:

 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 }); 

If this is what you need, check out the NodeInterface class. It has many useful methods: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.NodeInterface

+13
source

It may be an older thread, but I had a problem when I added a child to the selected node. I wanted to show a new child by expanding the selected node, and that failed.

Reason: The selected node to which I added the child has the 'leaf' property set to true. That was right. But due to the addition, this is no longer the case. And because of this, apparently Ext refuses to extend node ...

So be careful: when you add a node to another node, make sure that you set the 'leaf' property for parentNode to 'false':

 var newNode = Ext.create('some.model.TreeModel', savedNode); newNode.set('parentId', record.parentLocationId); selectedNode.set('leaf', false); selectedNode.appendChild(newNode); selectedNode.expand(); treeView.getSelectionModel().select(newNode); 
0
source

Source: https://habr.com/ru/post/913899/


All Articles