ExtJs 4 reload node in Tree Panel and URL loading error

In ExtJs 4 Tree Panel a node is basically the Model record that is associated with the Tree Store which in turn is associated with the Tree Panel. Now all you need is a reference record object/node that you want reloaded from the Server using the Ajax proxy associated with the Tree store.

Here is how to do it ...

 refreshNode.removeAll(false);
 this.getMyTreeStore().load({
  node : refreshNode
 });

Explanation

• refreshNode is the record/node reference
• this.getMyTreeStore() is reference to your Tree Store
• refreshNode.removeAll(false) is not really needed, this is only to fix an ExtJs 4 bug

ExtJs 4 bug when reloading a node that was already loaded once

Uncaught TypeError: Cannot call method 'indexOf' of undefined. I have wasted a lot of time on this bug, If you see this error then make sure you call Node.removeAll(false) before doing a reload or use a TreeStore override for the load function as shown below

Ext.override(Ext.data.TreeStore, {
    load: function(options) {
        options = options || {};
        options.params = options.params || {};


        var me = this,
        node = options.node || me.tree.getRootNode(),root;


        //If there is not a node it means the user hasn't defined a rootnode yet. 
        //In this case lets just create one for them.
        if (!node) {
            node = me.setRootNode({
                expanded: true
            });
        }


        if (me.clearOnLoad) {
            node.removeAll(false);
        }


        Ext.applyIf(options, {
            node: node
        });
        options.params[me.nodeParam] = node ? node.getId() : 'root';


        if (node) {
            node.set('loading', true);
        }


        return me.callParent([options]);
    }
});