Ext JS 4.1：将点击事件监听器添加到headerCheckbox

Question

我有一个可选行的网格。你可以在JS Bin找到我的代码。

如何将点击事件侦听器添加到包含复选框的列标题中？

此代码不起作用：

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

添加监听器复选框是好的：

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

但我想整个头部，不仅复选框，侦听点击事件。 ：？'（

如何做到这一点分别，为什么我的代码失败

Answer 1

诀窍是事件监听器添加到headerCheckbox的元素，而不是组件本身。

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

请参阅JS Bin。

Thx to @ scebotari66指向我正确的方向！

Answer 2

this.columns[0]似乎参考你的‘第一列’其实this.columns.length回报2.这里被存储到列中的引用是什么？。

此外，这些列没有单击事件，因此您在其元素上设置了一个点击侦听器

这就是说，这里是验证码：

listeners: { 
    viewready: { 
     fn: function() { 
      var checkcolumnHeader = this.columnManager.columns[0]; 

      checkcolumnHeader.getEl().on('click', function() { 
       console.log('clicked'); 
      }); 
     } 
    } 
} 

而且工作小提琴：https://fiddle.sencha.com/#view/editor&fiddle/262i