PDA

View Full Version : Tree that gets children only when expanded



johnterran
29 Dec 2011, 4:04 PM
Hi,

How can I create a tree that only gets the children node when the parent is expanded?
The entire tree is just too large to get at once.
Is there a example for this?

Thanks
John

skirtle
29 Dec 2011, 6:59 PM
You don't need to do anything special to make the nodes lazy, that's the default when you work with remote data. Here's the beginnings of an example:


var treeStore = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: 'tree.json'
},
root: {
text: 'Root'
}
});

Ext.create('Ext.tree.TreePanel', {
height: 300,
renderTo: Ext.getBody(),
store: treeStore,
width: 300
});

Beyond what's shown here you'll need to implement relevant logic on the server to return the correct nodes. Each time a node is expanded it will send off a request for its children, passing the node id as a request parameter.

See:

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore-cfg-nodeParam
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.TreeStore-cfg-defaultRootId

johnterran
30 Dec 2011, 10:31 AM
I see. Thanks!