Adding Node to TreePanel with a Button. Newbie How To?

Question

I have a button that I put an click event on.

I also have a TreePanel loaded with static JSON.

The TreePanel has an ItemID of projectTree

Inside my button click event I have:

var treeNode = projectTree.getRootNode();
treeNode.expandChildren(true); // Optional: To see what happens
treeNode.appendChild({
        name: 'Child 4',
        leaf: true,
        element : 6
});
treeNode.getChildAt(2).getChildAt(0).appendChild({
        name: 'Grand Child 3',
        leaf: true,
        element: 7
});

It does not add the nodes. What am I doing wrong?

Edited

var treeNode =  this.child('#projectTree').getRootNode();
treeNode.expandChildren(true); // Optional: To see what happens
treeNode.appendChild({
        name: 'Child 4',
        leaf: true,
        element : 6
});

// This one does not work
treeNode.childNodes(0).nextSibling.appendChild({
        name: 'Grand Child 3',
        leaf: true,
        element: 7
});

Where/how is the variable projectTree defined? Are there any errors? What version of ExtJS are you using? — forgivenson

Tủn Tủn · Accepted Answer · 2013-11-26T09:20:21

You need to refer to the TreePanel first, you can't just use the itemID as reference. There are many way of doing this, the simplest is to use Ext.getCmp:

var projectTree = Ext.getCmp('projectTree');

This is assuming you only have 1 component with that itemID, if not, it's better to use ComponentQuery, this is also my prefered method. Example, if your TreePanel is in a Container with an itemID "TreePanelContainer":

var projectTree = Ext.ComponentQuery.query('#TreePanelContainer > #TreePanel');

UPDATE:

Is it neccessary to use nextSibling? Why don't you use childNodes[1]?

treeNode.childNodes[1].appendChild({

Fiddle: fiddle.sencha.com/#fiddle/1rb

Also maybe I'm wrong but I've checked the document and there's no element config for TreeNode. Maybe you're using an odler version code. Try the offical documents from Sencha page.

Adding Node to TreePanel with a Button. Newbie How To?

Edited

1 Answers