Question

I’m runnning ExtJS 4.1 and have a tab opener defined below:

var tabs =   (typeof tabs != 'undefined') ? tabs : this.getMainTabs();
tabs = (typeof tabs == 'string') ? Ext.getCmp(tabs) : tabs;
var have_record = (typeof record != 'undefined' && record != '');

var id = have_record ? record.id : 'new';
var tab_id = 'tab-' + xtypeString + '-' + id;
var checkTab=Ext.getCmp(tab_id);

if(checkTab){
    tabs.setActiveTab(checkTab);
} else {
    var default_params = {xtype: xtypeString, closable : true, id : tab_id};
    var override_params = (typeof params != 'undefined') ? params : {};
    params = Ext.merge(default_params, override_params);

    var checkTab = tabs.add(params);
    tabs.setActiveTab(checkTab);
    (have_record) ? checkTab.setRecord(record) : checkTab.setRecord();
}
return checkTab;

So what’s happening is that we create an initial tab (tab-a) and then we go back to the main screen to create a second tab (tab-b). Now when I go and click on tab-a, nothing happens. When I go back to the main screen and then click on tab-a it opens up tab-b.

Anyone have thoughts on why this might be happening? (let me know if you need any more data… seems fairly self explanatory what I’m doing below though, but that could be cause I’ve been staring at this forever)

Heres the tabs with the xtype that we’re creating

{
   xtype: 'tabpanel',
   region: 'center',
   id: 'searchtabs',
   itemId: 'searchtabs',
   listeners: {
       tabchange: {
           fn: me.onSearchtabsTabChange,
           scope: me
       }
    }
 }

Answer 1

There could be a problem with your xtype definition, are you setting id or itemId?

Also notice that creating more than one component with the same id could lead to many troubles later on. If you are creating more than one instance of a component, make sure you assign different id upon creating – don’t give one in the xtype definition.