Hi,

I want to create a Tab panel in my west region inside the 1st panel i will be using the accordion layout and in the 2nd will be a simple panel.

here is my code



Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

var viewport = new Ext.Viewport({
layout: 'border',
items: [
// create instance immediately
new Ext.BoxComponent({
region: 'north',
height: 34, // give north and south regions a height
autoEl: {
tag: 'div',
html:''
}
}),

{
region: 'west',
id: 'west-panel', // see Ext.getCmp() below
title: 'Home',
width: 200,
minSize: 175,
iconCls: 'nav',
maxSize: 500,
collapsible: true,
margins: '0 4 4 4',
items: [
new Ext.TabPanel({
activeTab: 0,
region: 'center',
iconCls: 'nav',
items: [{
//new Ext.Panel({
id:'Menu',
autoHeight:true,
title: 'Menu',
border: false,
layout: {
type: 'accordion',
animate: true,
fill:true
},
items:[
//sriram

new Ext.Panel({
contentEl: 'west',
id:'Dashboard',
title: 'Dashboard',
border: false,
iconCls: 'settings' // see the HEAD section for style used
})
,
new Ext.Panel({
title: 'Administration',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,

new Ext.Panel({
id:'Sales',
title: 'Sales',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Contract',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Customer',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Services',
html: '<p>Some settings in here.</p><br>jksdfkjsdjk',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Order Provisioning',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Work Management setup',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Work Management',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Worklist',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,
new Ext.Panel({
title: 'Common Utilities',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})
,

new Ext.Panel({
title: 'Reports',
id:'Reports',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
})

//sriram end
]
//}),
},
//new Ext.Panel({
{
title: 'Heirarchy',
border: false
}
]
})
]
},

{
// lazily created panel (xtype:'panel' is default)
region: 'center',
contentEl: 'center1',
split: true,
height: 50,
minSize: 100,
maxSize: 200,
autoScroll: true,
collapsible: false,
title: 'Lead Details',
margins: '0 4 4 0',
pading:'5 5 5 5',
tbar: [{
text: 'Cut'
}]
}
]
});

});







All i get is the accordion do not adjust to actual height of the west region . Please help! some one