PDA

View Full Version : doubt with tabpanel



crazy
12 Oct 2009, 10:00 PM
hi all,

in my west panel, there are 3 buttons and when i click on these , how can i change the corresponding tabs in the centre panel
is it the tabpanel.activate() function
how can i do this....



{
region: 'west',
width: 200,
frame: true,
bodyStyle:'padding:10 10',
items: [

{
frame: true,
xtype: 'button',
text: 'Tab1',
handler: function(){
//
}
},
{
frame: true,
xtype: 'button',
text: 'Tab2',
handler: function(){
//
}
},
{
frame: true,
xtype: 'button',
text: 'Tab3',
handler: function(){
//
}
}
]
},
{
region: 'center',
id: 'centre-panel',
layout: 'border',
frame: true,
items: [
{
region: 'north',
layout: 'fit',
xtype: 'panel',
frame:true,
height: 35,
items: [

]
},
{
region: 'center',
items: [
{
xtype: 'tabpanel',
id: 'centreTabPanel',
activeTab: 0,
items: [
{
title: 'Tab1',
frame: true,
items: [
]
},
{
title: 'Tab2',
frame: true,
items: [
]
},
{
title: 'Tab3',
frame: true,
items: [
]
}
]
}
]
}
]
},



thanks
cRaZy

BitPoet
12 Oct 2009, 11:45 PM
Give your panels individual ids like:


{
title: 'Tab1',
frame: true,
items: [...],
id: 'mytab1'
}


and then pass this id to the activate method.


{
xtype: 'button',
text: 'Tab1',
handler: function() { Ext.getCmp('centreTabPanel').activate('mytab1'); }
}

crazy
13 Oct 2009, 12:48 AM
k thanks bitPoet........