Question

unfortunately I wasn’t able to find any useful info about getting ‘Ext.tab.Panel’ by id. I’ll be more specific with a source:

I’m defining a panel to work with:

Ext.define('MyMobileApp.view.Main', {
extend: 'Ext.tab.Panel',
xtype: 'main',
id: 'mainTabPanel',
....

In currently active view, which is contained in this panel I created a button and put a handler on it:

xtype: 'button',
text: 'Switch View',    
handler: function () {
    var main = Ext.getCmp('mainTabPanel'); //.getActiveTab();
    main.setActiveTab(Ext.getCmp('AnotherView'));
...

Where ‘AnotherView’ is id of a view which is also part of the panel.

But i’m getting error when trying to ‘setActiveTab’:

Uncaught TypeError: Object [object Object] has no method 'setActiveTab'

Looks like extjs is finding an object, but can’t serialize?

All I want to do is switch views by custom buttons handlers.

Answer 1

The problem ist, that the Tab Panel doesn’t have the function 'setActiveTab'

You have to use 'setActiveItem' instead.

Sencha Touch 2 Api: http://docs.sencha.com/touch/2-1/#!/api/Ext.tab.Panel-method-setActiveItem

xtype: 'button',
text: 'Switch View',    
handler: function () {
    var main = Ext.getCmp('mainTabPanel'); //.getActiveTab();
    main.setActiveItem(Ext.getCmp('AnotherView'));
    //main.setActiveItem(1); //You can also set the new item with the index of it
    ...