как использовать контроллер для управления меню в extjs4 - PullRequest
Новая
       21

как использовать контроллер для управления меню в extjs4

0 голосов
/ 16 сентября 2011

Я пытаюсь создать веб-приложение CRM, используя extjs4 MVC. После разработки простой веб-страницы я пытаюсь использовать контроллер для управления меню на левой панели. Но контроллер так сложен для меня.

Из-за некоторых причин, связанных с дизайном пользовательского интерфейса, во внешней части панели дерева меню есть панель.

Вот мой код.

приложение / просмотр / MenuBar.js 

Ext.define('Crm.view.MenuBar',{
    extend: "Ext.panel.Panel",
    alias: 'widget.crm_menubar',
    requires: ['Crm.store.Menus'],
    initComponent: function(){
    var store = Ext.create('Crm.store.Menus');
    Ext.apply(this,{
        xtype:'panel',  
        title: "menu"
        width: 212,
        frame:true,
        hideCollapseTool:true,
        split: true,
        collapsible:true,
        collapseMode: 'mini',
        items: [
            Ext.create('Ext.tree.Panel',{
                id: 'menutree',
                border: false,
                height: '100%',
                rootVisible: false,
                store: store
            })
        ]
    });
    this.callParent();
    }
});

Приложение / магазин / Menus.js 

Ext.define('Crm.store.Menus',{
    extend: 'Ext.data.TreeStore',
    root: {
            expanded: true, 
            children: [
                {   text: "subrootitem1",
                    expanded: true,
                    children:[
                    { id: 'a', text: "item1", leaf: true},
                    { id: 'b', text: "item2", leaf: true },
                    ]
                },
                {   text: "subrootitem2", 
                    expanded: true, children: [
                        { id: 'c', text: "item1", leaf: true },
                        { id: 'd', text: "item2", leaf: true}
                    ]
                }
            ]
        }
});

приложение / контроллер / Menu.js 

Ext.define('Crm.controller.Menu',{
    extend: 'Ext.app.Controller',
    refs: [{ref: 'menubar', selector: 'crm_menubar'}],
    init: function(){
        alert('test'); // this line can already execute when page is loading  
        this.control({
            'crm_menubar': {
                itemmousedown: this.onItemClicked
            }
        });
    },
    onItemClicked: function(){
        alert('clicked');
    }
});

Я хочу взаимодействовать с меню. Но код этой строки не работает. Наконец «рефери» неясны. Можете ли вы дать мне какое-то решение

1 Ответ

2 голосов
/ 16 сентября 2011

Попробуйте зарегистрировать контроллер на древовидной панели: 

this.control({
    'crm_menubar treepanel[id="menutree"]': {
        itemclick: this.onItemClicked,
        scope : this
    }
});
...