Question

I´m newbee in javascript and have some headaches.. I note that the “this” object, inside a event handler function is not the main class, like here:

Ext.define('App.controls.VerticalMenu', {
extend: 'Ext.panel.Panel',

setMenu: function(item) { 

    "this" here, is a "VerticalMenu"
    var theBtn = Ext.create('App.controls.VerticalMenuItem',{
        listeners: {
            onOpenClose: function(btn){
                "this" here is a "VerticalMenuItem"
            }
        }
    });
},

How to access the main “this” object (VerticalMenu) inside this event handler function ?

Answer 1

J Torres’s answer is one way. In Ext, depending on how you add the listener, sometimes you can specify a scope.

setMenu: function(item) { 

    var theBtn = Ext.create('App.controls.VerticalMenuItem',{});
    theBtn.on('openclose',function(btn){
        //what we want to do
    }, this); // Preserves the current scope of this for use inside the handler
},