PDA

View Full Version : Grid doesnt render output when not active in accordion?



saadkhan
13 Mar 2010, 8:04 PM
I have a accordion in which I have placed 2 grids and a listview (within panel)....If active item of accordion is anything but not the grids, they doesnt render their output until they are active in accordion and store is loaded. But my listview inside a panel is workin all fine....I tried placing my grids in panel and then putting them in accordion but no luck....What am I doing wrong over here???



/*
* ================ Route =======================
*/

var routeGrid = new Ext.grid.GridPanel({
title: 'Route',
store: routeStore,
hideHeaders: true,
trackMouseOver: false,
disableSelection: true,
layoutConfig:
{
autoExpandColumn: 'location'
},
autoExpandColumn: 'location',
columns:
[
{id: 'location', header: "Location", dataIndex: 'Location', renderer: function(value,p,r){ return String.format("<b>{0}</b><br />{1}<br />{2}<br /><span style='color: gray'>{3}, {4}</span>", value, r.data['Speed'], r.data['DateAndTime'], r.data['Latitude'], r.data['Longitude']); }}
]
});



/*
* ================ Detail =======================
*/
var detailListView = new Ext.list.ListView({
id: 'detailListView',
store: [],
disableHeaders: true,
hideHeaders: true,
reserveScrollOffset: true,
tpl: new Ext.XTemplate(
'<tpl for="rows">',
'<div class="search-item">',
'<span><b>{CustomerName}</b></span><br />',
'<span>Sim Port: {SimPort}</span>',
'</div>',
'</tpl>'
),
columns:
[
{id: 'vehicleId', header: "VehicleId", dataIndex: 'VehicleId'}
]
});

var detailListViewPanel = new Ext.Panel({
id: 'detailListViewPanel',
collapsible:true,
layout:'fit',
title:'Details',
items:
[
detailListView
]
});



And here is my accordion:


var accordion = new Ext.Panel({
region: 'west',
margins: '0 0 0 0',
split: true,
width: 250,
autoWidth: false,
minWidth: 250,
maxWidth: 500,
fill: true,
layout: 'accordion',
renderHidden: true,
sequence: true,
bodyStyle: 'background:#eee;',
border: false,
activeItem: 0,
collapsible: true,
layoutConfig:
{
fill: true, animate: true
},
items: [routeGrid, detailListViewPanel],
tools:
[
{
id: 'gear',
handler: function() {

}
}
]
});


And I am showing data into these listview and grid from outside Ext.onready....