PDA

View Full Version : how to autoExpand multiple grid columns in center after collapsible the east region



vijaypatil12
15 Nov 2010, 12:55 AM
how to autoExpand multiple grid columns in center after collapsible the east region

right now only one column is autoExpanding, I want all columns to be expanded

//my code is as below

var viewport = new Ext.Viewport({

layout: {
type: 'vbox',
align: 'stretch'
},

items: [{
flex: 1,
xtype: 'container',
layout: 'border',
items: [

new Ext.BoxComponent({
region: 'north',
contentEl: 'header',
height: 74

}), {
region: 'south',
contentEl: 'example-grid-south',
header: true,
split: true,
height: 185,
minSize: 100,
maxSize: 500,
collapsible: true,
collapseMode: 'mini',
autoScroll: true,
title: 'South region',
margins: '0 0 0 0'
}, {
region: 'east',
title: 'East region',
header:true,
collapsible: true,
collapseMode: 'mini',
split: true,
width: 540,
minSize: 100,
maxSize: 1900,
margins: '0 0 0 0',
contentEl: 'example-grid-east',
autoScroll: true

},
{
region: 'center',
title: 'Center region',
//margins: '0 0 10 0',
xtype: 'grid',
//autoExpandColumn : true,
//autoExpandMax : 400,
//autoExpandColumn: 'primarysource',



store: store,
columns: [
{header: "id", width: 120, dataIndex: 'id', sortable: true, hidden:true},
{header: "Primary Source", width: 120, dataIndex: 'Primary_Source', sortable: true, id:'primarysource'},
{header: "Alarm Type", width: 120, dataIndex: 'Alarm_Type', sortable: true, id:'alarmtype'},
{header: "Alarm Time", width: 100, dataIndex: 'Alarm_Time', sortable: true},
{header: "Severity", width: 100, dataIndex: 'Severity', sortable: true, renderer: severity},
{header: "State", width: 100, dataIndex: 'state', sortable: true, renderer: state},
{header: "Last Modified", width: 115, dataIndex: 'lastmodified', sortable: true},
{header: "Acting User", width: 105, dataIndex: 'actinguser', sortable: true},
{header: "View Trace", width: 105, dataIndex: 'viewtrace', sortable: true, renderer:
function(value, metaData, record, rowIndex, colIndex, store){return '<a href = "ViewTrace.html">' + value + '</a>'; }},
sm
],



sm: sm,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
}),
sm: new Ext.grid.RowSelectionModel({
listeners: {
rowselect: function(sm,index,record) {
//var rec = store2.getById(record.data.id);
//store1.removeAll();
//store1.add(rec);

var array = new Array();

store2.each(function(reco) {
if (reco.data.base_id == record.data.id) {
//alert(reco.data.base_id)
array.push(reco);
}
});

store1.removeAll();

for (var k=0; k < array.length; k++) {
store1.add(array[k]);
}


}
}
}),
autoScroll: true
}]
},
{
autoHeight: true,
xtype: 'box',
el: 'id-of-footer'
}
]

});

store.load();

Condor
17 Nov 2010, 10:57 AM
You can't have multiple autoExpandColumns, but you could configure the grid with forceFit:true and mark the columns that shouldn't resize with fixed:true.