PDA

View Full Version : Tabpanel size



coooolmagic
12 Jul 2010, 2:39 AM
hi all

i am trying to use example code of Tabpanel provided by ExtJS

I am not able to resize the panel of the full length of the page. there is always some space left around the panel.

is there any way to do that? please point me to right direction.

basically i want my TabPanel to cover complete page in terms of size.

Condor
12 Jul 2010, 3:38 AM
Use a viewport, e.g.

new Ext.Viewport({
layout: 'fit',
items: {
xtype: 'tabpanel',
activeTab: 0,
items: [{
title: 'Tab 1'
},{
title: 'Tab 2'
},{
title: 'Tab 3'
}]
}
});

coooolmagic
12 Jul 2010, 4:43 AM
Hi

thanks for reply, can you please suggest me viewport use in reference to this code i have written for Tabs?
sorry as I am beginner in this


var tabs = new Ext.TabPanel({
renderTo: 'tabs1',
width: 1200,
height: 800,
activeTab: 0,
items:[{
title: '&nbsp&nbsp&nbsp&nbspCMO View&nbsp&nbsp&nbsp&nbsp',
bodyCfg: {tag: 'iframe', src: '<%=Form.makeUrl(request, "/custom/hr.jsp")%>'}
},{
title: '&nbsp&nbsp&nbsp&nbspSCM View&nbsp&nbsp&nbsp&nbsp',
bodyCfg: {tag: 'iframe', src: '<%=Form.makeUrl(request, "/custom/accounts.jsp")%>'}
}]
});

Condor
12 Jul 2010, 4:53 AM
1. Remove the renderTo config option (and the tabs1 element).
2. Add:

new Ext.Viewport({layout: 'fit', items: tabs});

coooolmagic
12 Jul 2010, 5:00 AM
beautiful!!!! thanks a lot