[UNKNOWN][3.1] TabPanel activate, setActiveTab IE7,8

[bart]

Hello,

I have a problem after upgrading ExtJs from 3.0 to 3.1 in IE7 and IE 8 (Firefox works properly).

I have a code, which creates new tab in TabPanel and makes it active. It looks working properly when adding one new tab, but when I try to open more tabs in loop it opens only one tab. Code look something like this (I've shortened it, because it's much longer)



for (var i=0; i<selectedProducts.length; i++) {
panel.add({...});
panel.setActiveTab(newPanelId);
}
The problematic function is setActiveTab (or activate - I tried these two functions with every possible manner). When I remove line with setActiveTab it works properly (of course without setting tabs as active). When I tried to add alert() function after setActiveTab it doesn't throw any message so the code must break after setActiveTab function.

In IE 8 I don't get any exception, in IE 7 it's only 'unknown runtime error'.

[Condor]

You'll have to post an example, because I tried a simple test and it doesn't have this problem.

var tabs = new Ext.TabPanel({
items: {
itemId: 'tab0',
title: 'First'
}
});
new Ext.Viewport({
layout: 'fit',
items: tabs
});
for(var i = 1; i < 50; i++){
var itemId = 'tab' + i;
tabs.add({
itemId: itemId,
title: 'Tab ' + i
});
tabs.setActiveTab(itemId);
}

[bart]

Ok, so here is the code that adds tabs (it checks if tab of this id is already open. If not it adds new tab):



this.addTab = function(item, tabContentId){
var xtype = (item.xtype ? item.xtype : item.id)+'Tab';
var tab = this.items.find(function(i){return i.id === item.id;});
var xTypeRegistered = Ext.ComponentMgr.isRegistered(xtype);
if (!tab && xTypeRegistered) {
var tabTitle = this.shortenTabName(item.text);
var tabTip = tabTitle<item.text ? item.text : false;
tab = this.add({
id: item.id
,title: tabTitle
,tabTip: tabTip
,closable: true
,xtype: xtype
});
if (item.tabContentId) {
tab.items.itemAt(0).id = item.tabContentId;
}
} else if (!xTypeRegistered) {
Ext.Msg.show({
title: 'Błąd!'
,msg: 'Rozszerzenie typu "' + xtype + '" nie zostało zarejestrowane!'
,buttons: Ext.Msg.OK
,icon: Ext.MessageBox.ERROR
});
}
this.setActiveTab(tab);
};



And here is code that adds tabs



var handler = function(b) {
var sm = this.getSelectionModel();
if (!sm.hasSelection()) {
return;
}
var selectedProducts = sm.getSelections();
for (var i=0; i<selectedProducts.length; i++) {
tabs.addTab({
xtype:'productForm'
,id:'product'+selectedProducts[i].id
,text:'Produkt: '+selectedProducts[i].data.name
,tabContentId: 'productForm'+selectedProducts[i].id
});
}
}

[Condor]

Why are you using:

var tab = this.items.find(function(i){return i.id === item.id;});
instead of

var tab = this.getComponent(item.id);

ps. I would recommend using itemId instead of id, so you don't have to make sure that your ids are globally unique.