PDA

View Full Version : Insert a node at a specific location in Ext.tree.panel



nil5286
1 Mar 2012, 2:52 AM
I'm trying to change this ext js treegrid sample: http://dev.sencha.com/deploy/ext-4.0.1/examples/tree/treegrid.html
(http://dev.sencha.com/deploy/ext-4.0.1/examples/tree/treegrid.html)All I want is to add a node at a specific location.I tried this:


var treePanel = Ext.getCmp('treePanel');
var selNode = treePanel.getSelectionModel().getSelection()[0];
var appendedChild = selNode.appendChild({
task: 'Task1',
user: 'Name',
duration: '10',
leaf: true
});

It gives no errors, but the UI doesn't update. Same thing with selNode.insertChild(0, .. It runs with no errors, but the UI doesn't update.Somehow this works:


var node = treePanel.store.getRootNode();
node.appendChild({
task: 'Task3',
user: 'Name',
duration: '10',
leaf: true
});

So how do I append/insert at a specific location based on user selection.Here is what my full code looks like: http://jsfiddle.net/4T68s/
I changed the store to static data because a crossdomain request to get the json data wouldn't work.

tobiu
1 Mar 2012, 4:38 AM
this one should be easy to fix:



getSelectionModel().getSelection()


returns an array of records, not the node.

with the record, you have the record id and you can use:
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore-method-getNodeById

nil5286
2 Mar 2012, 8:20 AM
@tobias , Yes i tried using that but the problem i was facing using getNodeById is that i used the below code which can be seen in fiddle

var selNode = treePanel.getSelectionModel().getSelection()[0];

and selNode.id gives me "Ext.data.Store.ImplicitModel-ext-gen1009-ext-record-14"

and as per docs the getNodeById wants the object id as parameter which i am confused for where will i get that from.

getNodeById (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore-method-getNodeById)( Object (http://docs.sencha.com/ext-js/4-0/#!/api/Object) id ) : Ext.data.NodeInterface (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.NodeInterface)Returns the record node by id

Thanks in advance.

vietits
2 Mar 2012, 3:56 PM
@ni5286

You should check the node to see whether it is a folder node or a leaf node. You can only append / insert chilld nodes to a folder node not leaf node. (In fact, you can append/insert child nodes but they won't be shown).

In case you still want append/insert nodes to a selected node to create a tree, then you should change that node to folder node with <node>.set('leaf', false);