Geek asks and answers

How to dynamically load a controller into a specific event call in extjs4?

I work in extjs4. I am stuck at the point where I want to dynamically load the controller in extjs4. I am using the controllers this.getController () method to dynamically load the controller. * When I put this code in the init () function of a specific controller, then it works and the controller loads dynamically. * Here is my controller code ...

Ext.define('B.UserController',{ 
----
init:function()
{
    var controller = this.getController('kp.PollController');
    controller.init();                  // launch init() method
    this.control(
            {
                 'KpLogin button[action=loginAction]':
                      {
                          click:this.authenticateUser
                      },
            });
},
-----

But when I put my code in a specific function (button event), then it gives me an error. Here is my code ...

    Ext.define('B.UserController',{  
    -------   
    init:function()
    {
            this.control(
                {
                     'KpLogin button[action=loginAction]':
                          {
                              click:this.authenticateUser
                          },
                });
    },
     authenticateUser:function(button)
    {
      var controller = this.getController('kp.PollController');
      controller.init();                  // launch init() method
    }
    -----

After posting this code, then I got an error in firebug ...

Uncaught TypeError: Cannot read property 'readyState' of undefined Connection.js:818
Ext.define.onStateChange Connection.js:818
(anonymous function)

Here is my app.js code ....

Ext.application({
    name:'B',
    autoCreateViewport:true,
    controllers:['sn.UserController','qb.QbquestionController','kp.DnycontentController',/*'kp.PollController','kp.PolloptionController',*/'kp.KpquotationController','qb.QbqnsController','kp.CuriosityquestionController','kp.WordController','kp.DnycontentcategoriesController'],
    launch:function()
    {
        console.log('Application launch');  
    },//End of launch function
     });

I do not know what is going wrong. Please give me some suggestions ....

+5
source share
5 answers

, ? , init X, , Y, init() .

, , :

if (!this.application.controllers.get(controllerName)) {
     var controller = this.getController(controllerName);
     controller.init();                
}

, init , , .

Ext.application()?

0

getController , .

, "addProperty" .

:

MyApp.Current.getController('UserController');
0

, scope ? , this . this - .

Either install me = thisin init, and refer to me or wrap the event handler in a function like this:

'KpLogin button[action=loginAction]':
{
   click: function() {
      this.authenticateUser();
    }

Make sure you pass argumentsif you also need to handle the event.

I think there is a third way, specifically setting a scope: thislistener for this.

'KpLogin button[action=loginAction]':
{
   click: authenticateUser,
   scope: this
}
0
source 
Ext.application({

   launch: function() {
      _myAppGlobal = this;
   }
});

var controller = _myAppGlobal.getController('kp.PollController');
0
source

You can put below code in authenticateUser function

authenticateUser:function(button) {
    var app = this.getApplication(),
        controller = Ext.create('kp.PollController', {
            application: app
    });
    app.getControllerInstances()['kp.PollController'] = controller;
    controller.init();
}
0
source

More articles:


All Articles