Hi everyone,

I want to set first tab of a tabpanel to be visible/focused when problem loads.

Here is what example:

Code:
/*!
 * Ext JS Library 3.2.0
 * Copyright(c) 2006-2010 Ext JS, Inc.
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
Ext.onReady(function(){

    var tabs = new Ext.TabPanel({
        renderTo:'tabs',
        resizeTabs:true, // turn on tab resizing
        minTabWidth: 115,
        tabWidth:135,
        enableTabScroll:true,
        width:600,
        height:250,
        defaults: {autoScroll:true},
        plugins: new Ext.ux.TabCloseMenu()
    });

    // tab generation code
    var index = 0;
    var tabobj;
    while(index < 7){
        addTab();
    }
    
    tabs.setActiveTab('a1');
    
    function addTab(){
        tabs.add({
            title: 'New Tab ' + (++index),
            iconCls: 'tabs',
            id: "a" + index,
            html: 'Tab Body ' + (index) + '<br/><br/>'
                    + Ext.example.bogusMarkup,
            closable:true
        }).show();
    }

    new Ext.Button({
        text: 'Add Tab',
        handler: addTab,
        iconCls:'new-tab'
    }).render(document.body, 'tabs');
});

The problem is if i set first tab active, the tabpanel's body show first tab's content but the last is visible (try refreshing 4 to 5 times if u dont get his behaviour - 2 times works fine for me but not after that)

Can anyone suggest some solution for this?
Thanks a lot for help
Regards