PDA

View Full Version : About Sencha/Ext JS Events fire & on



Peter.Chen
22 Dec 2010, 8:28 PM
We're working on a web apps. To keep components pre-configured, I did a lot Ext.extend work.

Here is the pre-definitions.

In the entrance, in index.js


Ext.setup({
onReady: function() {
var app = new App();
}
});
The main class, in App.js, App will new some card components, such as


App = Ext.extend(Ext.Panel,{
initComponent: function(){
this.sub1 = new Sub_Class_1();
this.sub2 = new Sub_Class_2();
this.sub3 = new Sub_Class_3();
this.items = [this.sub1, this.sub2, this.sub3];
App.superclass.initComponent.call(this);
this.sub1.on('Event1', this.Event1_fn, this)
},
Event1_fn: function(){
//some codes
}
});
The problem comes, in the definition of Sub_Class_1, in Sub_Class_1.js:


var firefun = function(){
this.fireEvent('Event1');
};
Sub_Class_1 = Ext.extend(Ext.Panel,{
//some similar init configure jobs.
//add *firefun* into this class
})
The problem is, if I fire the event in firefun, there is no reaction of the program. Is there something wrong about the scope? What suggestions I can use to fix it?

Thanks a lot.

RWaters
22 Dec 2010, 11:24 PM
Why are you defining firefun outside of Sub_Class_1? you are running into a scope issue because the function ref firefun is getting saved with this === window and not your instance of Sub_Class_1.

Try something like:


Sub_Class_1 = Ext.extend(Ext.Panel,{
//some similar init configure jobs.
//add *firefun* into this class
someFunction: function() {
this.fireEvent('Event1');
}
});

Peter.Chen
22 Dec 2010, 11:27 PM
Thanks, Rich. This works!