ExtJS 4：一个网格列，显示带有 checkall 标题的复选框并且可以隐藏答案

【问题标题】：ExtJS 4: A grid column that displays checkbox with checkall header and can be hiddenExtJS 4：一个网格列，显示带有 checkall 标题的复选框并且可以隐藏
【发布时间】：2013-09-26 15:09:01
【问题描述】：

我们使用的是 ExtJS 4.2，所以这是我这个问题的背景。

我需要在网格中有一个列：

在每行显示一个复选框，可以选择/取消选择。它的目的是跟踪用户选择，而不是与底层商店数据同步。
在标题中有一个复选复选框，允许用户选择或取消选择网格中的所有行。
可以在页面呈现时根据特定条件（用户权限或数据）隐藏/删除。

我尝试了以下方法：

SelModel - 将满足第 2 条要求，但一旦定义就无法操作（请参阅http://www.sencha.com/forum/showthre...selectionModel）。
CheckColumn - 满足要求 3，但在列标题中没有复选框（请参阅 http://www.sencha.com/forum/showthread.php?265924）。

有没有办法让我实现我想要的？

提前致谢

海西

【问题讨论】：

标签： extjs checkbox selectionmodel

【解决方案1】：

查看我对这个问题的回答： ExtJS 4 select multiple CheckColumn checkboxes with checkbox header

您需要做的补充是，在网格存储的“更新”事件中，您需要手动创建代码，根据记录中的新值选择具有网格 selectionModel 的行。

【讨论】：

雷米乌斯，感谢您的回复。我遵循了您在链接帖子中所写的内容，但无法使其正常工作。没有显示标题复选框。是因为我使用的是 4.2 版吗？无论如何，我不想覆盖默认的 checkcolumn 类，而宁愿扩展它并创建我自己的类。还有什么建议吗？
4.2的网格渲染系统和4.2有很大的不同，所以大概是这个原因。我只能建议您查看代码的工作原理，看看是否可以将其移植到 4.2。另外，如果您想对其进行子类化，只需将第一个参数中的类名称更改为 Ext.define 并更改小部件名称即可。
感谢您的提示，我将查看 4.2 代码库以找出答案。
我设法用复选框添加了标题。您必须更改函数 getHeaderCheckboxImage ，它返回如下内容：'
'+ ''+text+'' 其中text=this.title，title必须在columncheck中定义。

【解决方案2】：

我有相同的要求并且能够使用“Ext.selection.CheckboxModel”功能（Ext 4.2）。基本上，我通过配置对象覆盖了渲染器。我正在使用 Sencha Architect 3，这是生成的代码：

selModel: Ext.create('Ext.selection.CheckboxModel', me.processMyCheckboxSelectionModel3({}))

processMyCheckboxSelectionModel1: function(config) {
        config.renderer = function(value, metaData, record, rowIndex, colIndex, store, view) {
            var status = record.get('Status');
            if (status  === 'Failed') {
                        var baseCSSPrefix = Ext.baseCSSPrefix;
                        metaData.tdCls = baseCSSPrefix + 'grid-cell-special ' + baseCSSPrefix + 'grid-cell-row-checker';
                        return '<div class="' + baseCSSPrefix + 'grid-row-checker">&#160;</div>';
            } else {
                        return '';
            }

        };
        return config;
}

当我希望它显示一个复选框时，渲染器返回的内容是从Reimius' answer 复制的，与此方法的唯一区别是我使用的是 Ext 4.2 内置的“Ext.selection.CheckboxModel”。

【讨论】：