4

I have a big app so I didn't add things in my app.js:

stores: []
controllers: []
views: []
models: []

Inside those are only things that I need for application to be created. So, when I click on the node (left panel) how can I create the controller I need and load model, view, store and other things in that controller? Is it enough just to call controller (because they are imported in controller)?

Something like

Ext.create('MyApp.path.SomeController');

Would it be added just like if I would add it in controllers: [] in app.js?

2 Answers 2

3

From my app.js, (thus this is an Ext JS application):

addController: function (name) {
        var c = this.getController(name); //controller will be created automatically by name in this getter 
        //perform the same initialization steps as it would have during normal ExtJs process
        c.init(this);
        c.onLaunch(this);
    }

name being the class name...

Remembering as well you can get a handle on the application instance from any other controller via this.application

Sign up to request clarification or add additional context in comments.

4 Comments

Does it have to be a full name: 'MyApp.file.controller' or just 'controller'? Thank you for answer. :)
full class name: 'MyApp.file.controller'
How can I get reference to my application (like you got with this) because I can't do .getController method?
Within which scope? Within the controller scope you have this.getApplication docs.
2

My code is very similar to that of Jenson.

// This function loads a controller dynamically and returns its first view
// Note: We don't call onLaunch(this) here. This method might be called during 
// bootstrap (like if there's a cookie with the recent page), after which 
// the application itself will call onLaunch (once out of the Launch method).
// The other issue is that the view is not added when this method is called
// and we might need to reference the view withing onLaunch, so this is the
// wrong place to call on Launch). Currently we're not relying on onLounch 
// with controllers.
dynamicallyLoadController: function( aControllerName )
{
    // See if the controller was already loaded
    var iController = this.controllers.get(aControllerName);

    // If the controller was never loaded before
    if ( !iController )
    {    
        // Dynamically load the controller
        var iController = this.getController(aControllerName);

        // Manually initialise it
        iController.init();
    }

    return iController;
},

loadPage: function( aControllerName )
{
    // save recent page in a controller
    Ext.util.Cookies.set( 'RecentPage', aControllerName );

    var iController   = this.dynamicallyLoadController( aControllerName ),
        iPage         = iController.view,
        iContentPanel = this.getContentPanel(),
        iPageIndex    = Ext.Array.indexOf(iContentPanel.items, iPage);

    // If the page was not added to the panel, add it.
    if ( iPageIndex == -1 )
        iContentPanel.add( iPage );

    // Select the current active page
    iContentPanel.getLayout().setActiveItem( iPage );
},

2 Comments

I've noticed that this solution causes the controllers listeners to be applied every time the view is created. For example, if you create a panel, then remove it (with auto destroy), then create a new panel - all listeners will fire twice. The listeners will keep building up each time you do this.
I figured out that the MixedCollection me.controllers never has the new controller added, therefore it will be reinitialising it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.