基于easyui的列汇总统计

最新推荐文章于 2021-02-23 09:52:43 发布

weixin_34396103

最新推荐文章于 2021-02-23 09:52:43 发布

阅读量437

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/673236963/blog/506364

版权

2019独角兽企业重金招聘Python工程师标准>>>

引用的方法
针对我们需要统计的列设置一个sum属性为true
{sortable:true,field : 'packageNum',title : '件数',width : parseInt($(this).width()*0.1),sum : true}
$("#table_id").datagrid({
     //设置表格的页脚，方便后续统计的数据存放。
     showFooter : true,
     //数据加载成功后调用方法
     onLoadSuccess : function() {
      $('#prepayDetail_dg').datagrid('statistics');
     }
});

二、js的实现

$.extend($.fn.datagrid.methods, {
 //仿照easyui的表格方法（例：appendRows的方法）
 statistics: function (jq) {
  //获取表格列
  var opt=$(jq).datagrid('options').columns;
  //取得表的行
  var rows = $(jq).datagrid("getRows");
  var footer = new Array();
  //定义统计的列有哪些
  footer['sum'] = "";
  //遍历表格的列，并判断是否存在统计的属性(sum)，并把我们需要统计的列提取出来
  for(var i=0; i<opt[0].length; i++){
   if(opt[0][i].sum){
    footer['sum'] = footer['sum'] + sum(opt[0][i].field)+ ',';
   }
  }
  //定义数组用于接收各列的统计值
  var footerObj = new Array();
  if(footer['sum'] != ""){
   var tmp = '{' + footer['sum'].substring(0,footer['sum'].length - 1) + "}";
   var obj = eval('(' + tmp + ')');
   if(obj[opt[0][1].field] == undefined){
    footer['sum'] += '"' + opt[0][1].field + '":""';
    obj = eval('({' + footer['sum'] + '})');
   }else{
    obj[opt[0][1].field] = "" + obj[opt[0][1].field];
   }
   footerObj.push(obj);
  }
  //将我们统计的值加载到页脚行（表格的最后一行）
  if(footerObj.length > 0){
   $(jq).datagrid('reloadFooter',footerObj); 
  }
  //将需要统计的列的值进行统计计算
  function sum(filed){
   var sumNum = 0;
   for(var i=0;i<rows.length;i++){
    sumNum += Number(rows[i][filed]);
   }
   //组装统计列的值，注：这里的sumNum可以根据你需要的数据，区别我们是否需要保留小数点sumNum.toFixed(2);
   return '"' + filed + '":"' + sumNum +'"';
  };
 }
});

转载于:https://my.oschina.net/673236963/blog/506364