View Full Version : Event Scope Help

19 Apr 2007, 7:17 AM
I'm trying to create some default components that my app will reuse, but I'm having a problem with the scope for a toolbar button listener. Here's my code (partial, simplified):

Ext.extend(Mission.FormView, Ext.form.Form, {
defaultSaveButton: {
cls: 'x-btn-text',
text: 'Save',
listeners: {
'click': function() {
scope: this

The button is added to a toolbar when the FormView is rendered (an extension of Form). The button is rendered successfully, but the method fails because 'this' refers to the 'Window' object (confirmed using Firebug). I would like it to refer to the FormView object.

I tried setting the scope a couple of different ways, but it didn't help.

I've never really been able to wrap my head around the scope (I'm coming from mainly a VB background). Any ideas?

19 Apr 2007, 7:40 AM
There's no "this" when that Ext.extend method is called.

If you are trying to create a reusable class called Mission.FormView, then at the time you are creating the prototype - which is just once, "this" will be the window.

That code creates one, single shared button definition spec at prototype creation time which specifies for the listener a scope of the window.

It's in the constructor, or an init() method called from the constructor that you should set up listeners.

19 Apr 2007, 7:50 AM
Thanks Animal, that really cleared it up for me.