CODEWITHSUNDEEP
extjssencha-touch
daxiang28
daxiang28

Reputation: 553

Sencha Touch access method in parent view

I'm trying to access a function from a component initialize. New to Sencha Touch/Ext.js, so not sure how scope works. I have 'spin' listeners in the 'control' which seem to work well, when incremented.

Simplified Code:

Ext.define('App.view.CreateChallenge', {
    extend: 'Ext.Container',
    fullscreen: true,
    xtype: 'CreateChallenge',
    config:{ 
        items[
            xtype: 'spinnerfield',
            itemId: 'mySpin',
            initialize:function(){
                App.view.Challenge.doThis();
            }
        ],
    control:{
        '#mySpin' : {
            spin: 'doThis'

        }
    }
    },
    doThis:function(){
       console.log('dooing this');
    }
});

Thanks, Steve

Upvotes: 0

Views: 2289

Answers (2)

Fawar
Fawar

Reputation: 735

I would simply use 

VIEW/This .getParent()

Upvotes: 0

Ye Liu
Ye Liu

Reputation: 8986

First of all, you should not override initialize method in the config block, the proper place for that is in Ext.define.

Then, in initialize, you can call App.view.CreateChallenge.doThis(). But it just an ordinary function, its scope is the global window object, so you don't have access to the object of App.view.CreateChallenge.

To find a container reference from its children, you can use Ext.Component.up(). In your case, it will look like:

initialize: function() {
    …
    this.up('CreateChallenge').doThis(); // find container by xtype then call its method
}

We are not there yet! If you try, you are going to get an undefined from this.up(…). This is because the container isn't finished constructing while its children are initializing. So, if you need a reference of the container in the initialize method, you need to wait until the container is ready, such as the painted event.

Then, you will end up something looks like:

initialize: function() {
    …
    this.on('painted', function () {
        this.up('CreateChallenge').doThis(); // find container by xtype then call its method
    }, this);
}

Upvotes: 2

Related Questions