how to trigger tab change in layout?

[benny]

Hi,

I've looked in the docs and searched the forums, but cannot find a way to trigger the activation of a tab.

I have layout extended from the 'complex layout' example. In the south panel I have 2 tabs. When a form is submitted and parsed in the second tab, I want the first tab to take focus.

Can anyone suggest a way to do this?

[Animal]

You didn't look very hard.

http://extjs.com/deploy/ext-1.1-beta1/docs/output/Ext.TabPanel.html#activate

[benny]

I found that reference pretty quickly, but cannot get it to work as expected (Sorry, should have said so in my first post).

Everything I try always returns '... is not a function' error. or '...has no properties'

For example, I have:



Example = function(){
var layout;
return {
init : function(){
layout = new Ext.BorderLayout(document.body, {
east: {
split:true,
initialSize: 202,
minSize: 175,
maxSize: 400,
titlebar: true,
collapsible: true,
animate: true
},
south: {
split:true,
initialSize: 200,
minSize: 100,
maxSize: 600,
titlebar: true,
collapsible: true,
autoScroll:true,
fitToFrame:true,
animate: true
},
center: {
titlebar: true,
autoScroll:true,
closeOnTab: true
}
});

layout.beginUpdate();
south1 = layout.add('south', new Ext.ContentPanel('south', {title: 'Current Messages', closable: false}));
south2 = layout.add('south', new Ext.ContentPanel('south2', {title: 'Create Message', closable: false}));
// ... etc


and if I add:


showMessages: function() {
layout.getRegion('south').activate(0); // fails
// or
south2.activate(); // fails
// or
Ext.ContentPanel.south1.activate(0); // fails
// or
Ext.ContentPanel.activate('south1'); // fails
},

(I call Example.showMessages(); to trigger the above function!)

I guess what I am saying is, how does one use the 'activate' method?

[Animal]

Well you have to have a variable called "south2" which is a reference to a ContentPanel.

In what scope does "south2" exist?

[benny]

As far as I can tell, the showMessages() function should have visibility of south2 and it is made public.

south2 is created like:


south2 = layout.add('south', new Ext.ContentPanel('south2', {title: 'Create Message', closable: false}));


and the showMessages() function is within the same structure (i.e. Example = function() {..., as per my above post).

After reading the docs again, I would have though that using:


Ext.TabPanel.activate('south2'); // active south2 tab


was the correct way, but the error is 'Ext.TabPanel.activate is not a function'
the above conditions also apply to 'south1'.

[Animal]

Ext.TabPanel.activate is indeed not a function.

You need a reference to the tabpanel you created, and call activate on that.

[benny]

Thanks for your help animal.
Doesn't look like I created any TabPanels, I used the example code of 'complex layout'. Looks like it creates the tabs by first creating the BorderLayout and then adding various ContentPanels. No TabPanels found anywhere in my code.

Do you know if my request is still possible with this layout?

[benny]

Found the solution :)

I only had to call:


layout.getRegion('south').showPanel('south');


thanks for your time animal.