Extjs GridPanel在有分页的情况下服务端统计合计实现方式

1、应用场景

在有分页的时候计算合计就不能采用Extjs gridpanel 提供的ftype: summary方式解决，否则只计算当前页的合计（因为数据只提取了当前页）；

2、解决办法

重写Ext.grid.feature.Summary中的generateSummaryData函数

//方法一，临时重写

Ext.grid.feature.Summary.override({

   generateSummaryData:function(){

       return this.view.store.getProxy().reader.rawData[this.remoteRoot];

   }

});

//方法二，定义类重写，以便其他模块引用（requires)

Ext.define('Ux.override.grid.feature.Summary',{

   override:'Ext.grid.feature.Summary',

   generateSummaryData:function(){

       return this.view.store.getProxy().reader.rawData[this.remoteRoot];

   }

});

3、Grid配置

features: [{

ftype: 'summary',

remoteRoot: 'summary'//后台提供数据的路径

}]

4、column配置

{

   text: "管线名称", dataIndex: "GXMC",width:120,

       summaryRenderer: function (value, summaryData, dataIndex) {

           return '(' + value + ' 项)合计：';

       }

},

{ text: "预算(万元)", dataIndex: "YXJE", width:120,summaryRenderer: rendernum(value) {

if (value) {

return Ext.util.Format.number(value, '0.####');

}

return '';

}

}

5、后台提供数据格式，在原来数据格式上添加，路径可自定，与此相配合 remoteRoot: 'summary'//后台提供数据的路径

"summary": {

    "YXJE": 80114.5575,

    "GXMC": 1081

  }

 

后感：

Ext.grid.feature.Summary 这个类在API中并没有remoteRoot配置项，但是通过查看EXTJS源码，发现已经实现了此配置项，但没有实现generateSummaryData方法，

其实EXTJS把这个服务端统计的功能已经几乎实现完了，但就差最后一小步了，所以大家在学习EXTJS的时候还是需要去了解源码实现的；

 备注：在Extjs5.1下测试通过，谢谢。