如何添加功能以创建窗口extjs4？

Question

my application is web desktop using 4.2 extjs. i just want to add my window a controller so that i can create a MVC but i cant figure out how to add the controller. Here's my code. The win variable is always undefined. how to fix it.? please help

Ext.define('MyDesktop.Modules.Itemmanagement.Client.Itemmanagement', {
    requires: ['Ext.tab.Panel',
        'Ext.ux.CheckColumn'],
    id: 'itemmanagement-win',
    init: function () {
        var me = this;

        this.launcher = {
            text: 'Itemmanagement Module ',
            iconCls: 'icon-itemmanagement',
            handler: this.createWindow,
            scope: this
        };

    },
    createWindow: function () {
        var me = this;
        var desktop = this.app.getDesktop();
        var win = desktop.getWindow('itemmanagement-win');
        if (!win) {
            Ext.application({
                name: 'USER',
                appFolder: '/modules/',
                controllers: [
                    "User"
                ],
                launch: function () {
                    win = desktop.createWindow({
                        id: 'itemmanagement-win',
                        title: 'Item Management',
                        width: 600,
                        height: 505,
                        iconCls: 'icon-itemmanagement',
                        animCollapse: false,
                        constrainHeader: true,
                        layout: 'fit'
                    });
                }
            });
        }
        win.show();
        return win;
    }
});

Answer 1

Create the window in your current application and don't create a new application.

createWindow: function () {
    var me = this;
    var desktop = this.app.getDesktop();
    var win = desktop.getWindow('itemmanagement-win');
    if (!win) {
        win = desktop.createWindow({
            id: 'itemmanagement-win',
            title: 'Item Management',
            width: 600,
            height: 505,
            iconCls: 'icon-itemmanagement',
            animCollapse: false,
            constrainHeader: true,
            layout: 'fit'
        });
    }
    win.show();
    return win;
}

Define a controller in your controller folder (eg app/controller/ItemmanagementWindow.js ). Add it to your controller section in your Application. Call in the init function this.control() with component queries you are interested and listen to the events.

Ext.define('MyDesktop.controller.ItemmanagementWindow',{
    extend: 'Ext.app.Controller',

    init: function(){
        this.control({
           // selector of window we want to add listeners to
           '#itemmanagement-win' : {
               // events we listen to
               afterrender: this.onAfterRender
           } 
        });
    },

    // handler function of the afterrender event
    onAfterRender: function(window, eOpts){
        //do some stuff in the after render event ...
    }
});

See Application , ComponenQueries and MVC architecture for more informations