PDA

View Full Version : How to define multiple columns in TreePanel with dynamic data in first column



shwetapro
24 Jul 2012, 6:32 PM
Hi,
Initially I created a treepanel with (by default) single column, whose data needs to be manipulated from an array. This runtime manipulation was done through appendChild() method.

The code goes here:

var panel = Ext.create('PanelJS', {
extend: 'Ext.tree.Panel',
renderTo: Ext.getBody(),
title: 'Plan Management',
width: 300,
height: 300,
useArrows: true,
singleExpand: true,
root: {
text: rootText
}
});

var rootNode = panel.getRootNode();
for(var i=0; i<planList.length; i++)
{
rootNode.appendChild({
text: planList[i],
id: someId,
leaf: false
});
}

When I created multiple columns(or used columns config) no data was getting visible in first column(dynamic data through appendChild() method).

The code goes here:

var panel = Ext.create('PanelJS', {
extend: 'Ext.tree.Panel',
renderTo: Ext.getBody(),
title: 'Plan Management',
width: 300,
height: 300,
store: store,
fields: ['planName'],
useArrows: true,
singleExpand: true,
root: {
text: rootText
},
columns: [
{
xtype: 'treecolumn',
text: 'Plan Name',
// dataIndex: 'planName',
flex: 1,
renderer :function(value, meta)
{
alert("value = " + value);
return value;
}
}
]
});

shwetapro
25 Jul 2012, 1:37 AM
Hi,

The problem got solved.
I did a silly mistake :D.

Instead of :
rootNode.appendChild({
text: planList[i],
id: someId,
leaf: false
});

It should be :
rootNode.appendChild({
planName: planList[i],
id: someId,
leaf: false
});

because the model I was using had planName as the field and I was setting the values in text config.

:):):):):)