PDA

View Full Version : Trouble changing TreeStore rootnode in TreePanel



invictvs
17 Jul 2014, 7:52 AM
I have a treepanel defined like so:


xtype: 'treepanel'
,id: 'overviewTree'
,width: 250
,height: 425
,autoScroll: true
,rootVisible: false
,store: me.store
,listeners: {
selectionchange: function(tree, selections, options) {
// read selectionchange, display correct grid
}
}


In my controller I change the treepanel data upon clicking a button by setting the root node to the root of a different json object, the only issue is one tree is displayed correctly while the other (secondOverviewTree) sometimes only displays the children, or sometimes it will display a root in between several children. The tree is constructed properly, and by changing rootVisible: true, the tree displays properly but this is not desired and upon clicking one of the tree items, I am getting an infinite loop resulting in "maximum call stack exceeded". I have stuck on this for some time now trying different methods, if anyone could shed some light on why the the tree is not displaying properly it would be much appreciated.



store.on('load', function(sto, records) {
var overview = Ext.widget('overviewtree', {
store: Ext.create('Ext.data.TreeStore', me.createOverviewTree(records[0].data, 'treeData'))
});

$c('button1').addListener('click', function() {
var json = me.createOverviewTree(records[0].data, 'treeData').root;
$c('overviewTree').getStore().setRootNode(Ext.create('Ext.data.TreeStore', json));
$c('button1').hide();
$c('button2').show();
});
$c('button2').addListener('click', function() {
var secondJson = me.createSecondOverviewTree(records[0].data, 'secondTreeData').root;
$c('overviewTree').getStore().setRootNode(Ext.create('Ext.data.TreeStore', secondJson));
$c('button2').hide();
$c('button1').show();
});

}, this, {single: true});
store.load();

invictvs
17 Jul 2014, 11:38 AM
I've found that if I don't add the final children in the tree, everything renders okay. Here is how I'm pushing the data:


pushTo = pushTo[0].children;
Ext.Array.forEach(data.userList, function(user) {
var toPush = {
id: user.id
,datatype: 'userData'
,userData: user
,text: user.name
,leaf: true
};
pushTo.push(toPush);
});

invictvs
18 Jul 2014, 5:39 AM
For anyone having a similar issue.. the reason this was happening is because I had duplicate record id's in the store. I just commented out the lines pushing the id into the json and everything worked as expected!