如何在extjs的网格页脚中添加总行

Question

我想在网格页脚中添加总行。我有该记录在商店中可用的总行。在网格中，用户选择降序排列，总行显示为第一行。谁能告诉我如何避免这种情况？

我将解释我的全部问题：

例如，我有网格视图，如 Target Target1 Target2 正在从 web 服务获取

 Month Target  Target1  Target2   Target(2-1)  Target%
  jan    500     1000    1001        1           0.99
  feb    600     2000    2001        1           0.99

  **total  1100     3000    3002        2          2*3002/100** need to calculate total% like this   

我正在计算存储中的值 Target(2-1) Target% 总值并将存储绑定到网格中。所以只有总列也会改变。在网格中，用户选择降序，总行也发生变化。谁能告诉我如何避免这种情况？

谢谢

Answer 1

您应该使用网格摘要功能，而不是常规行。 Here 是一个小提琴，它演示了您的示例的用法，以及自定义的 summaryType 函数，该函数实现了 Target% 总数的计算。

这比在商店里做记录做汇总计算更好，你不会在排序和过滤上遇到麻烦。

查看here 以获取文档和实时示例。基本上，您需要将该功能添加到网格中，例如：

Ext.create('Ext.grid.Panel', {
    ...
    features: [{
        ftype: 'summary'
    }],
    ...

并将 summaryType 配置添加到您需要的列中，例如：

columns: [{
    dataIndex: 'name',
    text: 'Name',
    summaryType: 'sum',
...

这就是自定义 summaryType 的样子：

dataIndex: 'targetPercent',
text: 'Target%',
summaryType: function(records){
    var totals = records.reduce(function(sums, record){
        return [sums[0] + record.data.target2, 
                sums[1] + record.data.targetDiff];
    }, [0,0]);

    return (totals[0] * totals[1]) / 100;
}