网格中的最后一列需要自定义标题

Question

所以我使用ExtJS来渲染带有数据的网格。我在网格上有很好的功能，但我想最后一行说“Total of All”，但它重复了第一组冠军。

以下是我的自定义组标题：

features: [{
        ftype: 'summary'
    }, {
        //ftype: 'grouping'
        ftype: 'groupingsummary',
        groupHeaderTpl: Ext.create('Ext.XTemplate',
            '',
            '{name:this.formatName} ({rows.length})',
            {
                formatName: function(name) {
                    return name.charAt(0).toUpperCase() + name.slice(1);
                }
            }
        ),
        //groupHeaderTpl: '{name} ({rows.length})',
        hideGroupedHeader: true
    }],

以下是生成总计标题的夏季类型配置：

columns: [{
                id       :'service-product',
                text   : 'Product',
                flex: 1,
                sortable : true,
                dataIndex: 'PACKAGE',
                summaryType: function(records) {
                    var myGroupName = records[0].get('LISTING');
                    return '<span style="font-weight: bold;">'+myGroupName.charAt(0).toUpperCase() + myGroupName.slice(1)+' Totals</span>';
                }
            }

以下是我想要自定义的突出显示标题的屏幕截图。我尝试了一些事情。任何人都知道如何获得对这个单元格的引用并更改标题？

提前谢谢你：）

森

Answer 1

您可以查看this内的summaryType。我注意到，当它被调用为总分组时，它指向Ext.data.Store，并且当它被调用时，正常＆＃39;分组指向Ext.util.Group。

所以示例summaryType可能如下所示：

summaryType: function(records) {
    console.log(this.$className);
    if (this.isStore) {
        return "Total of all";
    }
    var myGroupName = records[0].get('group');
    return '<span style="font-weight: bold;">' + myGroupName + ' Totals</span>';
}

工作样本：http://jsfiddle.net/b2LS5/4/