View Full Version : extjs 4.1 tree refresh a specific node

19 May 2012, 12:47 AM
I would like to refresh a node of a tree.I try something like that to refresh the root and it worked:

this.getStore('MyTreeStore').load({ params: { id: this.getId().getValue()} });

But now I would like to refresh only one Node and not the whole tree.

21 May 2012, 1:39 AM
Would be nice if someone can help :)

21 May 2012, 5:50 AM
Why just not:

var rowId = 1,
columnDataIndex = 1,
node = treepanel.getStore().getNodeById(rowId);

node.set(columnDataIndex, value);

21 May 2012, 7:01 AM
but it will make an update request, is it possible without that ? Just make a GET request to the server for a specific node.

21 May 2012, 10:42 PM
I don't understand you. This node is specified by rowId and columnId. It node.set will update only this one node.

22 May 2012, 3:32 AM
Yes but it change the data of my node and I don't want to change the data, I just want to refresh.

Is there any other way to make a refresh rather than update the node ?

Ujjwal Reddy
23 May 2012, 1:44 AM
If you want to load a particular node, then pass a node/record object in the store's load() call. This will load the data of that node (similar to an expand request of the node).

this.getStore('MyTreeStore').load({ node: someNode});

23 May 2012, 2:52 AM
Thanks it works. I just have another question.

When I reload the node and the name changed. The tree node keeps the old name, actually it's the "text" property. Should I put the record property under a specific property or is the response correct ?

text: 'New Name',
children: [array with child nodes],
success: true

Or should I reload the parent to get the new name ?

I think it's related to the issue: http://www.sencha.com/forum/showthread.php?206332-extjs-4.1-tree-add-new-node-with-server-changes

Ujjwal Reddy
23 May 2012, 3:32 AM
The load() call works just for loading the child nodes of the tree (similar to expanding the node - it doesn't change the expanded node's properties, but gets the child tree nodes). To get the new name, you might want to consider loading the parent tree node (but this loads all its child nodes and might not be an efficient solution).

If you know the new name before hand, then you use the following -

node.set('text', 'New Name');

This will set the name to the new name and commit the record to the store locally. But if the new name can only be gotten from the server, then consider getting the new name through an AJAX request and then using the above code to display the new name.

25 May 2012, 6:51 AM
Thanks for your answer that's inspired me.

setCompleted: function() {
this.complete = true;
this.running = false;

if (this.action === 'read' && this.node && this.response) {
data = Ext.decode(this.response.responseText);
if (Ext.isObject(data.node)) {
for (var key in data.node) {
this.node.set(key, data.node[key]);

I make a small workaround, it's a bit quick and dirty but it work as I expect.

The server just need to send a response like that:

node: {
text: 'New Name'
children: [array with child nodes],
success: true