Вам нужно делать иначе. Вы сейчас поместили меню внутрь грида. Если по нажатию кнопки скроете гид, то меню с кнопками пропадёт вместе с ним. Лучше для грида и табов создать общий контейнер. Меню прикрепить к контейнеру. Как-то так:
Файл с определением контейнера:
Ext.define('AM.view.user.Container' ,{
extend: 'Ext.panel.Panel',
alias : 'widget.mycontainer',
layout: 'fit',
items: [
{
xtype: 'userlist',
title : 'All Users',
hidden: false
}, {
xtype: 'mytabpanel',
title : 'Tabs',
hidden: true
}
],
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
items: [{
text: 'Table',
handler: function (button) {
button.up('mycontainer').down('userlist').show();
button.up('mycontainer').down('mytabpanel').hide();
}
},{
text: 'Edit',
handler: function (button) {
button.up('mycontainer').down('userlist').hide();
button.up('mycontainer').down('mytabpanel').show();
}
}]
}]
});
Файл с определением грида:
Ext.define('AM.view.user.List' ,{
extend: 'Ext.grid.Panel',
alias : 'widget.userlist',
store: 'Users',
columns: [
{header: 'Name', dataIndex: 'name'},
{header: 'Email', dataIndex: 'email'}
]
});
Файл с определением табов:
Ext.define('AM.view.user.Tabs' ,{
extend: 'Ext.tab.Panel',
alias : 'widget.mytabpanel', // перед свими алиасами ставьте префикс, чтобы случайно имя не совпало с алиасом компонента библиотеки
items: [
// здесь подключаем компоненты внутри вкладок
]
});
Возможны и другие варианты компоновки.