extjsextjs4onclicklistenergridpanelcolumnheader

Ext JS 4.1: Add click event listener to headerCheckbox

I have a grid with selectable rows. You can find my code at JS Bin.

How can I add a click event listener to the column header containing the checkbox?

This code doesn't work:

this.columns[0].on('click', function() {
    // Do stuff
});

Adding a listener to the checkbox is okay:

this.columns[0].textEl.on('click', function() {
    // Do stuff
});

But I want the whole header, not only the checkbox, to listen for click events. :'(

How do I achieve this? Respectively, why does my code fail?

Solution

  • The trick is to add the event listener to headerCheckbox's element, not the component itself.

    this.columns[0].el.on('click', function() {
    // Do stuff
});

    See JS Bin.

    Thx to @scebotari66 for pointing me in the right direction!