[2.0a1][CLOSED] Grid Toolbars not appearing in Web Desktop

[HarryC]

I'm playing with the Web Desktop sample. I've added header and paging toolbars to the grid window. I am also adding items to the header toolbar dynamically after render. When I do this the Paging toolbar does not appear until the grid is resized.


createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('grid-win');
if(!win){

var gridStore = new Ext.data.Store({
reader: new Ext.data.ArrayReader({}, [
{name: 'company'},
{name: 'price', type: 'float'},
{name: 'change', type: 'float'},
{name: 'pctChange', type: 'float'},
{name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
]),
data: Ext.grid.dummyData
})
var tbrHeader = new Ext.Toolbar();
var tbrPaging = new Ext.PagingToolbar({
store: gridStore,
pageSize: 10,
displayInfo: true,
displayMsg: '{0} - {1} of {2}',
emptyMsg: "No items to display"
});

win = desktop.createWindow({
id: 'grid-win',
title:'Grid Window',
width:740,
height:480,
x:10,
y:10,
iconCls: 'icon-grid',
shim:false,
animCollapse:false,
constrainHeader:true,
layout: 'fit',
items:
new Ext.grid.GridPanel({
border:false,
ds: gridStore,
cm: new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
{id:'company',header: "Company", width: 120, sortable: true, dataIndex: 'company'},
{header: "Price", width: 70, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
{header: "Change", width: 70, sortable: true, dataIndex: 'change'},
{header: "% Change", width: 70, sortable: true, dataIndex: 'pctChange'},
{header: "Last Updated", width: 95, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
]),

viewConfig: {
forceFit:true
},
//autoExpandColumn:'company',
tbar: tbrHeader, bbar: tbrPaging

})
});

tbrHeader.addButton({text: 'Add Something',iconCls:'add',tooltip:'Add a new row'});
tbrHeader.addButton({text: 'Options',iconCls:'option',tooltip:'Blah blah blah blah'});
tbrHeader.addButton({text: 'Remove Something',iconCls:'remove',tooltip:'Remove the selected item'});


}
win.show();
}

[jack.slocum]

If you provide an empty toolbar, it has no height, therefore the built in size calculations will be off initially. There is no way to work around this internally. However, you can trigger a recalc by calling syncSize() on the GridPanel. It may also be triggered just by calling window.doLayout() but it depends on the circumstances.

[HarryC]

Well it's the paging toolbar that isn't appearing. I assumed with the built in components within it that would set a height. Nonetheless (and thanks) the syncSize() call did the trick.

Thanks.