PDA

View Full Version : [CLOSED] activate event not caught by controller



keckeroo
29 Nov 2011, 10:57 AM
I have a card panel which is created in a Main view for the viewport. Tied to that panel I have a controller looking for events on the card panel.

In the Main view ... during the init ..



init: function() {
this.getMain();

if (authenticated) {
this.getMain().setActiveItem(1);
}
}



Controller:




this.control({
'panel1': {
activate: function() { alert("I'm active"); }
}
});



Now - when the application boots and I am not authenticated - card 0 is displayed for the login panel, I log in - card 1 is set active and perfect - the controller sees panel1 as active and fires the alert.

If, however, I reload the app and (because of cookies, etc) I am already authenticated the Main view does the 'setActiveItem' above - but the controller does not see the 'activate' event.

I have attached a listener directly to the panel, listening for 'activate' and both scenarios (non authenticated and preauthenticated) trigger the activate method. It's just when I try to do it using the controller that it's not noticed.

Of course, I would prefer to use a controller - since - um - that's where I should be listening for all these events - not in the panel itself.

Bug ?

Thank you.

Kevin

mitchellsimoens
29 Nov 2011, 4:02 PM
May be a bug may not... depends what your view is. Here is my test:


Ext.define('MyApp.controller.Main', {
extend : 'Ext.app.Controller',

init: function() {
this.control({
'container' : {
activate : function(cnt) {
console.log('container activated', cnt);
}
},
'panel' : {
activate : function(panel) {
console.log('panel activated', panel);
}
}
});
}
});

Ext.application({
name : 'MyApp',

controllers : ['Main'],

launch : function() {
Ext.create('Ext.Panel', {
fullscreen : true,
layout : 'card',
items : [
{
xtype : 'toolbar',
dock : 'top',
items : [
{
text : 'Next',
handler : function(btn) {
var panel = btn.up('panel');

panel.setActiveItem(1);
}
}
]
},
{
html : 'One'
},
{
xtype : 'panel',
html : 'Two'
}
]
});
}
});

activate event will fire when a component is visually active so at start up in my test code, we have the fullscreen Ext.Panel that extends Ext.Container so it will fire both the listeners... the one for container and the one for panel. So that works... now the first item with html : 'One' only fires the active listener for the container because the default type is container. Now when you press the next button it goes to the other item which I have specified to be a panel and it fires both activate listeners.

keckeroo
29 Nov 2011, 5:53 PM
Thank you for the response - I have figured out my problem - it all had to do with starting manipulating the dom (in the init of the 'Main' controller) before all the other controllers were loaded and initialized.

I moved my main view setup to the launch method of the application and all is well.

My apologies for the confusion.

Kevin