1. #1
    Sencha User
    Join Date
    Jan 2011
    Posts
    7
    Vote Rating
    0
    _dan is on a distinguished road

      0  

    Default How to disable buttons in an Ext.TabPanel?

    How to disable buttons in an Ext.TabPanel?


    Hi,

    I want to disable a button in an TabPanel. How would I do this? Setting the item to disabled does not work.

    Please help.

    PHP Code:
    Ext.setup({
        
    onReady: function() {
            
            var 
    btn1 = new Ext.Tab({
                    
    title'Home',
                    
    iconCls'home',
                    
    html:'<h1>1. Panel</h1>',
                    
            });        
            var 
    btn2 = new Ext.Tab({
                    
    title'Info',
                    
    iconCls'info',
                    
    html:'<h1>1. Panel</h1>',
                    
    disabled:true,
            });

            var 
    panel = new Ext.TabPanel({
                
    fullscreentrue,
                
    dockedItems: [],
                
    items: [btn1btn2],
                
    tabBar: {
                    
    dock:'bottom',
                    
    cardSwitchAnimation:'slide',
                    
    sortablefalse,
                    
    scroll: {
                        
    direction'horizontal',
                        
    useIndicatorstrue
                    
    },
                    
    layout: {
                        
    pack:'center'
                    
    }
                }

            });
        }
    }); 

  2. #2
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,395
    Vote Rating
    23
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi _dan.
    Take a look at this example to know how to do what you request.

    Code:
    Ext.setup({
        onReady: function() {
            
            var btn1 = new Ext.Tab({
                    title: 'Home',
                    iconCls: 'home',
                    html:'<h1>1. Panel</h1>',
                    
            });        
            var btn2 = new Ext.Tab({
                    title: 'Info',
                    iconCls: 'info',
                    html:'<h1>1. Info Panel</h1>',
                    disabled:true,
            });
    
            var panel = new Ext.TabPanel({
                fullscreen: true,
                dockedItems: [{
                    xtype:'toolbar',
                    dock: 'top',
                    title: 'Example',
                    items: [{
                        text: 'Disable Info Tab',
                        handler: function(){
                            
                             //Disable the Info Tab
                             panel.getTabBar().getComponent(1).setDisabled(true);
    
                        }
                    }]
                }],
                items: [btn1, btn2],
                tabBar: {
                    dock:'bottom',
                    cardSwitchAnimation:'slide',
                    sortable: false,
                    scroll: {
                        direction: 'horizontal',
                        useIndicators: true
                    },
                    layout: {
                        pack:'center'
                    }
                }
            });
        }
    });
    Hope this helps.
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    Owner at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    https://github.com/AndreaCammarata/TUX


  3. #3
    Sencha User
    Join Date
    Jan 2011
    Posts
    7
    Vote Rating
    0
    _dan is on a distinguished road

      0  

    Default


    Hi Andrea,

    thanks a lot. Disabling the tabbar item programmatically works great.

  4. #4
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,395
    Vote Rating
    23
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Quote Originally Posted by _dan View Post
    Hi Andrea,

    thanks a lot. Disabling the tabbar item programmatically works great.
    You are welcome
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    Owner at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    https://github.com/AndreaCammarata/TUX


  5. #5
    Sencha User
    Join Date
    Jan 2011
    Posts
    7
    Vote Rating
    0
    _dan is on a distinguished road

      0  

    Default


    One mor question

    Is there any way to get the tab bar item by it's id or a given tag? Like that:

    PHP Code:
    {
        
    xtype:'panel',
        
    html:'<h1>my html source code</h1>',
        
    id:'myPanelID'
    }
    panel.getTabBar().getComponent('myPanelID').setDisabled(true); 

  6. #6
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,395
    Vote Rating
    23
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi _dan, according to your request I open a new request of implementation to Sencha Team.
    Take a look at my post:
    http://www.sencha.com/forum/showthre...perty&p=566346

    I provide a simple solution to do this, you can temporarily adopt it to do what you request.

    Hope this helps.
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    Owner at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    https://github.com/AndreaCammarata/TUX


  7. #7
    Sencha User
    Join Date
    Jan 2011
    Posts
    7
    Vote Rating
    0
    _dan is on a distinguished road

      0  

    Default


    Hi Andrea, thanks again. You are awesome

  8. #8
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,395
    Vote Rating
    23
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    You are welcome _dan
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    Owner at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    https://github.com/AndreaCammarata/TUX


  9. #9
    Sencha User
    Join Date
    Apr 2014
    Posts
    1
    Vote Rating
    0
    ashishbansal is on a distinguished road

      0  

    Default im not able to see your post

    im not able to see your post



Similar Threads

  1. Enable/Disable Buttons under IE
    By cupakob in forum Ext GWT: Discussion
    Replies: 5
    Last Post: 13 Jul 2010, 9:42 AM
  2. Disable Back and Next Buttons
    By gwthompson in forum Sencha Touch 1.x: Discussion
    Replies: 1
    Last Post: 6 Jul 2010, 9:50 AM
  3. PagingToolbar - buttons do not disable
    By paco_online in forum Ext GWT: Help & Discussion (1.x)
    Replies: 0
    Last Post: 30 Mar 2009, 12:51 AM

Thread Participants: 2