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

Question

我们正在使用ExtJS 4.2，因此这是我对此问题的背景。

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

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

我尝试了以下内容：

1. SelModel - 它将满足第2项要求，但一旦定义就无法操纵（见http://www.sencha.com/forum/showthre...selectionModel）。

2. CheckColumn - 满足第3项要求，但在列标题中没有checkall框（参见http://www.sencha.com/forum/showthread.php?265924）。

我有办法实现我想要的目标吗？

提前致谢

海西州

Answer 1

请参阅我对这个问题的回答： ExtJS 4 select multiple CheckColumn checkboxes with checkbox header

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

Answer 2

我有相同的要求，并且能够使用'Ext.selection.CheckboxModel'功能（Ext 4.2）。基本上，我通过config对象覆盖渲染器。我正在使用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.selection.CheckboxModel'中的Ext 4.2。