[CLOSED]scope in defaults doesn't work

[steffenk]

Ext version tested:

Ext 3.2.1


Adapter used:

ext


Problem: Using defaults in a FormPanel applys the defaults, but scope get lost.
With this example, this is always the window instance, but not the Panel as expected.


defaults: {
xtype: 'checkbox',
checked: true,
listeners: {
check: function(checkbox, state) {
console.log(this); // <== this is the window but not the FormPanel
},
scope: this // <== this get lost
}
}

Example:

run this in FB console:


new Ext.Window({
title: 'Scope in Defaults',
width: 300,
height: 200,
layout: 'form',
bodyStyle:'padding:5px 5px 0',
defaults: {
xtype: 'checkbox',
checked: true,
listeners: {
check: function(checkbox, state) {
console.log(this); // <== this is the window but not the FormPanel
},
scope: this // <== this get loosed
}
},
items: [
{fieldLabel: 'Checkbox 1'},
{fieldLabel: 'Checkbox 2'},
{fieldLabel: 'Checkbox 3'},
{fieldLabel: 'Checkbox 4'},
{fieldLabel: 'Checkbox 5'}
]
}).show();

[evant]

What are you expecting "this" to refer to? Because when you're setting it, "this" will point to the window object (not the Ext.Window, but the browser window).

[mankz]

Works fine, try this modified code example and console will tell the truth :)


var a = {
init: function () {
new Ext.Window({
title: 'Scope in Defaults',
width: 300,
height: 200,
layout: 'form',
bodyStyle: 'padding:5px 5px 0',
defaults: {
xtype: 'checkbox',
checked: true,
listeners: {
check: function (checkbox, state) {
console.dir(this); // <== this is the window but not the FormPanel
},
scope: this // <== this get loosed
}
},
items: [{
fieldLabel: 'Checkbox 1'
},
{
fieldLabel: 'Checkbox 2'
},
{
fieldLabel: 'Checkbox 3'
},
{
fieldLabel: 'Checkbox 4'
},
{
fieldLabel: 'Checkbox 5'
}]
}).show();
}
};

a.init.call(a);
a.init.call(window);

[evant]

Marking this as closed. The reason this is happening is because the Ext.Window object isn't yet created by the time the "defaults" object is created, so it just points to the browser window object.

[steffenk]

Ok, i see the problem. But i also have left an understanding problem - how to add the right scope to the handler.
In my apps this work as i have nearly always extended objects where i call the init manually, but this simple snippet shows the problem. The trick from mankz is also capsulating and call the init, but i don't see this as a practicable pattern for apps - am i wrong?