如何在ExtJS 4中使用CheckBoxModel时监听所有“Checked”或“UnChecked”事件？

在ExtJS 4中，我在我的grid.Panel中使用了CheckBoxModel以及显示当前选定记录数的显示计数。然后，当单个记录被选中或取消选中后，通过监听事件来更新我选择的记录数，然后发布选定的数组值。在选择单个记录时它工作得很好。但是，当我选中或者取消选择所有记录的“ALL”复选框时，我似乎找不到我的侦听器点击事件的入口点，因此我显示的记录数不会更新。此外，CheckBoxModel没有这样的“ALL”选定/未选定事件。如何在ExtJS 4中使用CheckBoxModel时监听所有“Checked”或“UnChecked”事件？

来源

2011-12-22 user1110938

尝试在CheckboxModel上添加selectionchange侦听器：发生选择更改后触发。

检查this

来源

2011-12-22 09:29:06 MMT

好的建议，但逻辑可能会很棘手 - 如果你点击ALL框或最后剩下的框，所有选择都是相同的 - 这可能是也可能不是你想要的。 – dbrin 2011-12-22 21:47:19

谢谢MMT。我会测试你的建议！ – user1110938 2011-12-24 18:24:07

@ user1110938如果有效，不要忘记选择它（左边的复选标记），以便其他人知道。 – Geronimo 2012-01-09 00:47:31

最近我发现自己还需要结合对电网的某些功能的全选和deselectall操作。我的解决方案是扩展checkboxmodel选择模型，以便我可以附加在正确时间触发的selectall和deselectall听众。最简单的方法是这样的。

首先宣布你的新模式，并确保它扩展了checkboxModel

Ext.define('My.selection.CheckboxModel', { 
    extend: 'Ext.selection.CheckboxModel', 
    onHeaderClick: function (headerCt, header, e) { 
    if (header.isCheckerHd) { 
     e.stopEvent(); 
     var me = this, isChecked = header.el.hasCls(Ext.baseCSSPrefix + 'grid-hd-checker-on'); 
     me.preventFocus = true; 
     if (isChecked) { 
     me.deselectAll(); // Pass true as a parameter to prevent selectionchanged and select events firing 
     me.fireEvent('deselectall', me); 
     } 
     else { 
     me.selectAll(); // Pass true as a parameter to prevent selectionchanged and select events firing 
     me.fireEvent('selectall', me); 
     } 
     delete me.preventFocus; 
    } 
    } 
});

然后在网格中添加以下selModel的配置对象：

selModel: Ext.create('My.selection.CheckboxModel', { 
    checkOnly: true, // you can add whatever normal configuration properties you want here 
    listeners: { 
     selectall: function() { console.log('selectAll'); }, 
     deselectall: function() { console.log('deselectAll'); } 
    } 
    }),

其值得注意的是，selectionChanged和select网格上的听众和行也将触发，除非您在扩展选择模型中传递真正的selectall和deselectall调用。

来源

2013-09-29 21:49:11

如何在ExtJS 4中使用CheckBoxModel时监听所有“Checked”或“UnChecked”事件？

回答

相关问题