1. #1
    Sencha User
    Join Date
    Sep 2008
    Posts
    83
    Vote Rating
    0
    frankthetank is on a distinguished road

      0  

    Default [SOLVED] Tab Panel - Auto change the active tab

    [SOLVED] Tab Panel - Auto change the active tab


    Hi,

    I would like to know if it's possible to add an event to the tabPanel to make it change automatically every 5 seconds the active tab. (Like a carousel for example).

    Is it possible ?

    Code:
    new Ext.TabPanel({
                                border:false,
                                activeTab:0,
                                animScroll:true,
                                tabPosition:'top',
                                scrollDuration:1,
                                enableTabScroll: true,
                                items:[
                                    {html:'test',title:'Nouvelle 1'},
                                    {html:'test2',title:'Nouvelle 2'}
                                ]
                            })
    Thanks !
    Last edited by frankthetank; 6 Jan 2009 at 9:36 AM. Reason: solved

  2. #2
    Sencha User
    Join Date
    Sep 2008
    Posts
    83
    Vote Rating
    0
    frankthetank is on a distinguished road

      0  

    Default


    Here is how I figured out something with a Task.

    Code:
    var selectedTab = 0;
    
    var task = {
                run: function(){
                    
                    if(selectedTab < 5){
                        selectedTab++;
                        Ext.getCmp('tabpanel_nouvelles').setActiveTab(selectedTab);
                    }else{
                        selectedTab = 0;
                        Ext.getCmp('tabpanel_nouvelles').setActiveTab(selectedTab);
                    }
                },
                interval: 5000
            }
            Ext.TaskMgr.start(task);

  3. #3
    Sencha User
    Join Date
    Sep 2008
    Posts
    83
    Vote Rating
    0
    frankthetank is on a distinguished road

      0  

    Default


    if someone clicks the tab, here is the listeners I've put.

    Code:
    ,listeners: {
          tabchange : function (panel, tab) {
              selectedTab = panel.getActiveTab().id-1;
         }
    }
    Each tab id is the number (1 to 5).