Results 1 to 3 of 3

Thread: When to hide buttons in toolbar

  1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    35
    Vote Rating
    0
      0  

    Default Answered: When to hide buttons in toolbar

    Hi I'm trying hide buttons on toolbar and getting error "Ext.getCmp("SelectBtn") is undefined".
    I guess that during initComponent() buttons wasnt rendered yet.
    on which event or method I can hide buttons?

    Code:
        initComponent: function() {
      
    
        this.dockedItems = [{
            xtype: 'toolbar',
                dock:'top',
                items: [
                    {
                    minWidth: 80,
                    text: 'Select',
                    id:'SelectBtn',
                    iconCls: 'icon-check',
                    
                },{
                    minWidth: 80,
                    text: 'Edit',
                    id: 'editBtn',
                    iconCls: 'icon-modify',
                    hidden: true,
                    
                },{
                    minWidth: 80,
                    text: 'New Item',
                    id: 'NewItemBtn',
                    iconCls: 'icon-modify',
                },{
                    iconCls: 'icon-delete',
                    text: 'Delist',
                    id: 'DelistBtn',
                    action: 'delete'
                    minWidth: 80,
                    iconCls: 'icon-delete',
                       
                    }
                },{
                    minWidth: 80,
                    text: 'SKU Report by Product',
                    iconCls: 'icon-report',
                    handler : function() {
                        exportToExcel('P');
                    }
                },{
                    minWidth: 80,
                    text: 'SKU Report by Account',
                    iconCls: 'icon-report',
                    handler : function() {
                        exportToExcel('D')
                    }
                }]
            }];
            if (isUserInquiry){
                Ext.getCmp('SelectBtn').hide();
                Ext.getCmp('DelistBtn').hide();
                Ext.getCmp('NewItemBtn').hide();
            }
            this.callParent(arguments);
            
        }

    Thanks.

  2. You should wait for 'render' event to do that. However, with your case, you can do the same thing by configuring 'hidden' of each button basing on isUserInquiry.
    Code:
    initComponent: function() {
        this.dockedItems = [{
            xtype: 'toolbar',
            dock:'top',
            items: [{
                minWidth: 80,
                text: 'Select',
                id:'SelectBtn',
                iconCls: 'icon-check',
                hidden: isUserInquiry

  3. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347
    Vote Rating
    119
      0  

    Default

    You should wait for 'render' event to do that. However, with your case, you can do the same thing by configuring 'hidden' of each button basing on isUserInquiry.
    Code:
    initComponent: function() {
        this.dockedItems = [{
            xtype: 'toolbar',
            dock:'top',
            items: [{
                minWidth: 80,
                text: 'Select',
                id:'SelectBtn',
                iconCls: 'icon-check',
                hidden: isUserInquiry

  4. #3
    Sencha User
    Join Date
    Apr 2012
    Posts
    35
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by vietits View Post
    You should wait for 'render' event to do that. However, with your case, you can do the same thing by configuring 'hidden' of each button basing on isUserInquiry.
    Code:
    initComponent: function() {
        this.dockedItems = [{
            xtype: 'toolbar',
            dock:'top',
            items: [{
                minWidth: 80,
                text: 'Select',
                id:'SelectBtn',
                iconCls: 'icon-check',
                hidden: isUserInquiry

    Great answer! Thanks a lot!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •