Threaded View

  1. #1
    Sencha User luismerino's Avatar
    Join Date
    Oct 2011
    Location
    Berlin
    Posts
    46
    Vote Rating
    4
    Answers
    1
    luismerino is on a distinguished road

      0  

    Default Answered: Assigning listeners in config does not apply the handlers to a panel

    Answered: Assigning listeners in config does not apply the handlers to a panel


    Code:
    Ext.define('MyApp.view.Add', {
        extend: 'Ext.Panel',
        
        config: {
            fullscreen: true,
            layout: 'card',
            items: [
                {
                    xtype: 'panel',
                    layout: {
                        type: 'vbox',
                        pack: 'center',
                        align: 'center'
                    },
                    items: [
                        {
                            xtype: 'panel',
                            html: 'Justin Beefer'
                        }
                    ]
                }
            ],
            listeners: {
                painted: function() {
                    console.log('foo');
                }
            }
        },
    When creating a new instance, the listeners won' tbe fired, however when using on()/addListener() upon the instance, then the events work. What's going on?

  2. You should use the following pattern:

    Code:
    Ext.define('MyApp.view.Add', {
        extend: 'Ext.Panel',
        
        config: {
            fullscreen: true,
            layout: 'card',
            items: [
                {
                    xtype: 'panel',
                    layout: {
                        type: 'vbox',
                        pack: 'center',
                        align: 'center'
                    },
                    items: [
                        {
                            xtype: 'panel',
                            html: 'Justin Beefer'
                        }
                    ]
                }
            ]
        },
        initialize : function() {
           this.on({
                 scope  : this,
                painted : this.onPainted
            });
            this.callParent();
        },
        onPainted : function() {
             console.log('foo');
        }
    })