PDA

View Full Version : Border Layout under Tab won't show up



bisquerick
3 Dec 2009, 11:15 AM
Please help, I've been looking at this for a day and I can't figure it out. If you run my code below, you can see the tabs that are simple HTML, but the tab with the nested border layout doesn't show up. Can anyone see what I'm doing wrong? My hope is to have the border layout fill all the space under the tab.

Thanks in advance...
Rick



Ext.QuickTips.init();
var accord = {
title: 'Applications'
,layout: 'accordion'
,height: 600
,items: [
{title: 'Axis'}
,{ title: 'CMDS'}
,{ title: 'Supplier Portal'}
]
}
var messageLayout = {
layout: 'border'
,items: [{
region: 'west',
width: 275,
items:[accord]
},{
region: 'center',
}]
}
var tab1 = {
title:'Messages'
,layout:'fit'
,items:[messageLayout]
}
var tab2 = {
title: 'Tab 2'
,html: 'tab2 content'
}
var tab3 = {
title:'Tab 3'
,html: 'tab3 content'
}
var tabs = {
xtype: 'tabpanel'
,layoutConfig: {
layoutOnTabChange:true,
}
,activeTab: 0
,items: [tab1,tab2,tab3]
}
var headerPanel = {
region: 'north'
,height: 75
,html: '<h1>The header</h1>'
}
var bodyPanel = {
region: 'center'
,border: false
,items: [tabs]
}
Ext.onReady(function() {
new Ext.Viewport({
layout: 'border',
items: [headerPanel,bodyPanel]
});
});