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

问题描述

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

我将解释我的全部问题：

例如我有网格视图Target Target1 Target2从webservice获取

 月目标目标1目标2目标（2-1）目标％
 jan 500 1000 1001 1 0.99 
 feb 600 2000 2001 1 0.99 
 
 **总计1100 3000 3002 2 2 * 3002/100 **需要计算总额％这样
  

我正在计算值Target（2-1）目标％存储中的总值，并将存储绑定到网格中。所以只有总列也改变了。在网格中，用户选择降序，总行也会更改。有没有人可以告诉我如何避免这种情况？

谢谢

解决方案

您应该使用网格摘要功能，而不是常规行。 是一个小提示，演示了您的示例的用法，并使用自定义summaryType函数来实现Target％总共。

这是一个更好的方法，而不是将总结计算作为商店中的记录，您不会遇到排序和过滤的麻烦。

查看的文献和实例。基本上，您需要将功能添加到网格中，如：

  Ext.create（'Ext.grid.Panel'，{ 
 ... 
功能：[{
 ftype：'summary'
}]，
 ... 
  / pre> 
 
 
并将一个summaryType配置添加到您需要的列中，如：
 列：[{
 dataIndex：'name'，
 text：'Name'，
 summaryType：'sum'，
 ... 
  
这就是自定义summaryType的样子：
  dataIndex：'targetPercent'，
 text：'Target％'，
 summaryType：function（records）{
 var totals = records.reduce ，记录）{
 return [sums [0] + record.data.target2，
 sums [1] + record.data.targetDiff]; 
}，[0,0]）; 
 
返回（总计[0] *总计[1]）/ 100; 
} 
  
 
I want to add total row in grid footer. I have total row that record is available in store. In grid the user selects descending order, total row appears as the first row. Can anybody tell me how to avoid this?
I will explain my full problem:
eg I have grid view like Target Target1 Target2 are getting from  webservice 
 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
I am calculating the value Target(2-1)  Target% total value in store and bind the store in grid. So only the total column also changes. In grid the user selects descending order, total row also changes. Can anybody tell me how to avoid this?
Thanks
 解决方案 
You should use the grid summary feature, instead of a regular row. Here is a fiddle that demonstrates the usage with your example, and with custom summaryType function that implements the calculation for your Target% total.
This is a better method than to do the summary calculation as a record in the store, you will not get into trouble with sorting and filtering.
Have a look here for documantation and live example. Basically, you need to add the feature to the grid like:
Ext.create('Ext.grid.Panel', {
    ...
    features: [{
        ftype: 'summary'
    }],
    ...
And add a summaryType config to the columns you need, like:
columns: [{
    dataIndex: 'name',
    text: 'Name',
    summaryType: 'sum',
...
And this is how the custom summaryType looks like:
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;
}
                        
这篇关于如何在extjs中的网格页脚中添加总行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！