there is I am getting problem during hiding tab panel in my application. Ok. I try to what is I am doing in my application.. please see below image

you can see there is multiple tabs. I want to hide it if user not have access provide by admin. I simply used array to push tab's panel in array, like this.

 panyManageitems.push(this.Company);
 panyManageitems.push(this.User);
 panyManageitems.push(this.ChangePassword);
 panyManageitems.push(this.Group); //etc

and this array I passed to another tab panel's Items config, Like this.

     thispanyManagePanel = new Ext.tab.Panel({
            cls: 'p-tab-panel',
            activeTab: 0,
            items:panyManageitems
           });

to manage tab access functionality I made a function that return ponent that I passed to that function if user have access to that ponent for eg. Change password. Function is like

userAccess(this.ChangePassword, 'Change Password');

this return if user not have permission to change password. and simply change password tab not get pushed in panyManageitems array, like this

 panyManageitems.push(userAccess(this.ChangePassword, 'Change Password'));

'Change Password' is a permission name. 2nd parameter of userAccess()

Problem is that: When function return null when user not have access to that ponent/tab tab index get changed of other successive tabs. so linking of tab not work out. means this code I written in another view/panel/ not working/ open another tabs that get index no.3

this.manageCompanypanyManagePanel.getLayout().setActiveItem(3);

there is I am getting problem during hiding tab panel in my application. Ok. I try to what is I am doing in my application.. please see below image

you can see there is multiple tabs. I want to hide it if user not have access provide by admin. I simply used array to push tab's panel in array, like this.

 panyManageitems.push(this.Company);
 panyManageitems.push(this.User);
 panyManageitems.push(this.ChangePassword);
 panyManageitems.push(this.Group); //etc

and this array I passed to another tab panel's Items config, Like this.

     this.panyManagePanel = new Ext.tab.Panel({
            cls: 'p-tab-panel',
            activeTab: 0,
            items:panyManageitems
           });

to manage tab access functionality I made a function that return ponent that I passed to that function if user have access to that ponent for eg. Change password. Function is like

userAccess(this.ChangePassword, 'Change Password');

this return if user not have permission to change password. and simply change password tab not get pushed in panyManageitems array, like this

 panyManageitems.push(userAccess(this.ChangePassword, 'Change Password'));

'Change Password' is a permission name. 2nd parameter of userAccess()

Problem is that: When function return null when user not have access to that ponent/tab tab index get changed of other successive tabs. so linking of tab not work out. means this code I written in another view/panel/ not working/ open another tabs that get index no.3

this.manageCompany.panyManagePanel.getLayout().setActiveItem(3);

• javascript
• extjs
• sencha-touch
• sencha-architect
• sencha-touch-2.1

• 1 Instead of hiding why dont you disable the tab , it will simplify your work ? – Tejas Commented Apr 11, 2017 at 11:57
• because I don't want to show that tab to user, On disable tab still show to user – Vikas Hire Commented Apr 11, 2017 at 12:11
• I have alternative solution for this.While creating tab you create some config say myTabIndex and assign it some index as per tab hierarchy.Then while setting active tab item use this config index instead of hard-coding tab index.Try this and reply. – Tejas Commented Apr 11, 2017 at 12:24
• But by using your 2nd solution code will bee very plex. and also I think slow down performance. there is three levels of accessing modules, 1.Supper Admin 2.Admin 3.User. – Vikas Hire Commented Apr 11, 2017 at 12:53
• 1 I am wondering why disable won't work. I have an idea for this, you take a flag for all admin credentials and use afterrender on basis of true and false. – UDID Commented Apr 11, 2017 at 13:10

3 Answers 3

If you want to hide a tab item available at this.Company and the corresponding tabbar entry, do as follows:

this.Company.hide();
this.Company.tab.hide();

I am modified code as bellow,

var panyManageitems = [];
        panyManageitems.push(this.panytab);
        panyManageitems.push(this.Usertab);
        panyManageitems.push(this.roletab); 

instead of:

panyManageitems.push(userAccess(this.this.panytab, 'Company'));
panyManageitems.push(userAccess(this.Usertab, 'Users'));
panyManageitems.push(userAccess(tthis.roletab, 'role'));

means, Simply I pushed all tabPanels in Array panyManageitems[] And hided tabs by index like this,

 if (userAccess(this.ChangepasswordPanel, 'Change Password') == null) {
            Ext.getCmp('panyTabBar').getTabBar().items.get(3).hide();
        }

Its Working....thank you

So, what you do is the following:

this.manageCompany.panyManagePanel.getLayout().setActiveItem(3);

SetActiveItem does indeed allow you to use the index, but it does also allow you to use a specific item or the itemId.

So, what you want to do is maybe the following:

if(this.manageCompany.panyManagePanel.items.indexOf(this.ChangePassword)>-1 && hasUserAccess('Change Password'))
   this.manageCompany.panyManagePanel.getLayout().setActiveItem(this.ChangePassword);