Extend a grid with listeners

Question

I'm trying to extend Ext.grid.Panel to build one who would come with "prebuild" listeners (that will check for a store, and tell the store to add the nulber of records in the title of the gridpanel). I'm stuck at the very beginning of this process, I can't find the right way to do this despite browsing the doc for a while:

//Extending a grid with a simple hello world... 
Ext.define('MIS.Ext.GridExtraHeaderData', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.gridExtraHeaderData',
    listeners:{
        beforerender:function(){
            console.log('hello world');
        }
    }
});

I replaced Ext.grid.Panel with MIS.Ext.GridExtraHeaderData and the grid is working very well, but I can't see any "hello world" in my console...

When I look to the created object, I have "listeners:null" and "proto.listeners" filled.

I tried constructor, initComponent, no success.

Evan Trimboli Evan Trimboli · Accepted Answer · 2013-12-19T11:08:25

Don't attempt to bind them in the listeners block, since they are going to clash with any user defined listeners. Instead, bind them in code:

Ext.define('MIS.Ext.GridExtraHeaderData', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.gridExtraHeaderData',

    initComponent: function() {
        this.on('beforerender', function() {
        }, this);
        this.callParent();
    }
});

Extend a grid with listeners

1 Answers