PDA

View Full Version : Configure Grid's columns in the run time



sj_tt6
3 Nov 2013, 2:15 PM
Hi,

Can somebody show me how to reconfigure the columns e.g. name, dataIndex of a grid in the run time so that the grid can display any csv files that have different column names?

I can get the list of the column names of a csv file but I could not find any methods on Grid to set its columns.

Thank you very much,

sj_tt6
3 Nov 2013, 3:23 PM
What I did was I created an array of column objects and called reconfigure (column_array) on the grid panel



var myCols = [];
for (var i = 0; i < new_cols.length; i++) {
var name = new_cols[i].name;
//sets the names of columns
myCols[i] =
{
text: name.toUpperCase(),
dataIndex: name,
width: 100
};
}
rawGrid.reconfigure(myCols);
//call rawGrid.doLayout() or doComponentLayout() but did not work

sj_tt6
5 Nov 2013, 8:31 AM
Anyone?

mazhar.shaikh
11 Nov 2013, 5:21 PM
You can probably get an idea from this, may not be the answer to your question. Hope it helps.I achieved it like this:


var grid = Ext.getCmp('eventItemsGrid');
// prepare columns
var columns = [];


var item = {
xtype: 'gridcolumn',
dataIndex: 'supplier',
text: 'Supplier',
tooltip: 'Supplier',
stateId: 'grid1Supplier',
stateful: true
};
columns.push(item);


item = {
xtype: 'gridcolumn',
width: 60,
dataIndex: 'cat1',
text: 'Cat 1',
tooltip: 'Category 1',
stateId: 'grid1Cat1',
stateful: true
};
columns.push(item);


item = {
xtype: 'gridcolumn',
width: 60,
dataIndex: 'scat',
text: 'Sub Cat',
tooltip: 'Sub-Category'
};
columns.push(item);


item = {
xtype: 'gridcolumn',
dataIndex: 'itemCode',
text: 'Item Code',
tooltip: 'Item Code',
stateId: 'grid1Itemcode',
stateful: true
};
columns.push(item);


item = {
xtype: 'gridcolumn',
width: 155,
dataIndex: 'itemDesc',
text: 'Description',
tooltip: 'Item Description',
stateId: 'grid1Itemdesc',
stateful: true
};
columns.push(item);

// FINALLY
var store = Ext.getStore('MyStore');
grid.reconfigure(store, columns);

sj_tt6
11 Nov 2013, 5:32 PM
Hi Mazhar,

I figured out the problem. The reconfigure() has 2 parameters store and columns. Since API said they are optional, so I just provided the new columns array. In fact I had to provide both parameters even I did not change any thing in the store.

Thanks anyway!

mazhar.shaikh
11 Nov 2013, 5:36 PM
Cool,

Thats what I did. Used two parameters.

Sometimes its confusing.. eh!

skirtle
11 Nov 2013, 5:56 PM
The store is optional in the sense that you can pass a null value to leave it unaltered but as you've observed you can't just leave it out of the parameter list altogether.

Note also that in some older ExtJS versions reconfigure had a bug that broke passing a null store.