Создание активного меню
 

Здравствуйте. Начал изучать ExtJS. По доке создал грид+меню. Как можно навешать на меню ссылки (кликаем на grid выводится табличка, кликаем tabs получаем табы)?
Вот моя вьюха:

Ext.define('AM.view.user.List' ,{
    extend: 'Ext.grid.Panel',
    alias : 'widget.userlist',

    title : 'All Users',
    store: 'Users',
    columns: [
        {header: 'Name',  dataIndex: 'name'},
        {header: 'Email', dataIndex: 'email'}
    ],
    
    dockedItems: [{
        xtype: 'toolbar',
        dock: 'top',
        items: [{          
          text: 'Table',
          handler: function () {
                alert('Show table');
            }        
          
        },{         
          text: 'Edit',
          handler: function () {
                alert('Show tabs');
            }
        }]    
      }]    
    
});

У вас уже есть 2 обработчика кнопок вот и реализовывайте в них то что вам надо ..типа: прячем панель1, показывам панель2 и тд и тп...

Вам нужно делать иначе. Вы сейчас поместили меню внутрь грида. Если по нажатию кнопки скроете гид, то меню с кнопками пропадёт вместе с ним. Лучше для грида и табов создать общий контейнер. Меню прикрепить к контейнеру. Как-то так:

Файл с определением контейнера:

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: [
          // здесь подключаем компоненты внутри вкладок
   ]

});

Возможны и другие варианты компоновки.