Reputation: 43

Hide an item from Ext.TabPanel

When i click on a button i need to hide the edit toolbar from the tabpanel.

This is my tabpanel :

Ext.onReady(function(){
       mainimgwidth = $("#imgMain").prop("width");
       tabpanel = new Ext.TabPanel({
           activeTab: 0,
           deferredRender:false,
           items: [
               {

                  title : '${tr.File}',
                  items : [
                      fileTlb
                  ]
               },
               {
                  id: 'editToolbar',
                  title: '${tr.Edit}',
                  items : [
                      editTlb
                  ]
               },
               { 
                  title: '${tr.Review}'
               }
           ]
       });

I tried this but i didnt work:

function remove(){
       var edit = tabpanel.getComponent('editToolbar');
       edit.setVisible(false);
    }

I also tried to use : edit.hide();

This is the edit toolbar:

var editTlb = new Ext.Toolbar({ 
            id:'edit_tlb',
            items:[
                new Ext.Toolbar.Button({
                         id:'btn_rotate_right',
                         iconCls: 'icon_rotate_right'
                         }),
                new Ext.Toolbar.Button({
                         id:'btn_rotate_left',
                         iconCls: 'icon_rotate_left'
                         }),
                new Ext.Toolbar.Button({
                         id:'btn_rotate_vertical',
                         iconCls: 'icon_rotate_vertical'
                         })
        ]
});

Upvotes: 1