Define controllers in app.js Extjs

Question

Here my app.js code :

Ext.Loader.setConfig({
    enabled: true
});

Ext.application({
    name: 'KP',
    appFolder: 'scripts/app',

    controllers: [
        'login.Login'
    ],

    views: [
        'login.Login'
    ],


    launch: function () {

        var view = Ext.widget('login')
    }


});

If I want to use some others views, controllers, models and stores in my application, should I define them in app.js? (like this : controllers[....all of my controllers.....]) Are there other way to get to work init function in my controllers? Thanks!

sra · Accepted Answer · 2013-01-22T11:12:30.800

There are many ways...

Following some basics first:

All controllers that are listed within the controllers array of the application controller get instantiated at startup (application get initialized with the onReady event. Also the init() and onLaunch() methods of the listed controllers get called. See the linked API for details when this occurs). Now each instantiated controller initialize its stores,views and models (creates getter for all and over that creates instances of each store while overwriting the storeId and append them to the Ext.StoreMgr). Note that each controller will contains his own models, stores and views.

The simplest way to receive a controller that is not listed in the application controller is by using a reference of the application controller and calling getController(name)

It is Important to know that while using that way the receive a controller instance the getter method will not call the init() or onLaunch() method for the invoked controller, it will just try to get the controller or create it. You should also note the API for those methods in these controllers are no longer correct. You need to set an init bool to these controllers and check it on the reference that the getController(name) method hands back to you. If it is undefined/false you call the init() / onLaunch() by yourself and set it after that. I use these technique by myself to reduce intial load for bigger application. I guess you don't really need this for just a handful of controllers.

Update

Due to some changes in the 4.1.x release it is no longer required to init the controller manually. This is now done for us by the getController method

@Oleg You're welcome! I know, cause I use a variant of this by myself to reduce initial load :) — sra, Sep 05 '12 at 07:17
@sra, nice answer, I've voted up. I'm using the same approach. And how do you `sencha build` dynamically loaded controllers (which are being created using `getController(name)`)? — bhovhannes, Jan 22 '13 at 10:58
@bhovhannes Thank you. To your question; I do not use the `sencha build` tool but you should be able to archive this with `requires` or `uses` on the application. Both should force the tool to include these classes. — sra, Jan 22 '13 at 11:12
@sra, I opened a new question regarding this: http://stackoverflow.com/questions/14457508/using-sencha-cmd-with-dynamically-loaded-controllers please, have a look — bhovhannes, Jan 22 '13 at 11:34

score 0 · Answer 2 · answered Sep 03 '12 at 08:19

You can define as many controllers as you want. To implement hierarchy you can define views and stores related to certain controller within it.

For example:

controller/
  artists.js (inside: artistsView1.js, artistsView2.js, artistsStore.js)
  paintings.js (inside: paintingsView1.js, paintingsStore.js)

All of your views and stores used in controllers would be loaded and initializadduring Applocation load.

score 0 · Answer 3 · answered Sep 03 '12 at 08:23

The controllers you define in your application are loaded before the application launch() is called. As each controller is loaded its models, views and stores (MVS) are also loaded.

Although you can define the MVSs in your application, I'd recommend that each controller defines its related MVSs, as it is possible for the programmer to load controllers (and their related MVSs) upon request rather than by default. It is also a good practice from reusability point of view (so if you ever to reuse the controller, you know what MVSs come with it).

You may want to include some views in the application if, say, they are used without controllers, like some sort of a custom window you display if there was some error in the system.

Define controllers in app.js Extjs

3 Answers3