EasyUI DataGrid 添加合计行

        后端返回合计行有时候并不简单，EasyUi DataGrid的Footer可以很方便的在前端添加合计行，并且能实现复杂的合计，例如columnA的合计是columnA的值相加，columnB的合计是columnB的平均值，columnC的合计是columnA的合计除以columnB的合计。

        要使Footer生效，必须设置DataGrid的属性showFooter:true,然后扩展我们的合计方法，直接贴代码：

 

$.extend($.fn.datagrid.methods, {
statistics: function(jq) {
        //所有的列
        var opt = $(jq).datagrid('options').columns;
    	//所有的行
        var rows = $(jq).datagrid("getRows");
    	//debugger;
        var footer = new Array();
        footer['sum'] = "";
        for (var i = 0; i < opt[0].length; i++) {
        	var s = opt[0][i].heji;
                console.info(s);
             //给需要合计计算的列定义合计属性，并且设置其计算规则，以下代码直接用eval函数执行计算规则，算出结果，暂时封了以下sum、avg、min、max四个函数，特殊需求自己加。
             //例如columnA的合计是columnA的值相加(定义为：{field: 'columnA', title: 'A', width: 120,heji: 'sum("columnA")'},其heji属性就是你要计算合计的方法实现)，
            //columnB的合计是columnB的平均值(定义为：{field: 'columnB', title: 'B', width: 120,heji: 'avg("columnB")'},其heji属性就是你要计算合计的方法实现)，
             //columnC的合计是columnA的合计除以columnB的合计(定义为：{field: 'columnC', title: 'C', width: 120,heji: '(sum("columnA")/avg("columnB"))'},其heji属性就是你要计算合计的方法实现)
            if (opt[0][i].heji) {
                footer['sum'] = footer['sum'] +'"' + opt[0][i].field + '":"' + eval(opt[0][i].heji) +'"' + ',';
            }
        }
        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][0].field] == undefined) {
                footer['sum'] += '"' + opt[0][0].field + '":"合计:"';//第0列显示为合计
                obj = eval('({' + footer['sum'] + '})');
            } else {
                obj[opt[0][0].field] = "合计:" + obj[opt[0][0].field];
            }
            footerObj.push(obj);
        }
        if (footerObj.length > 0) {
        	console.info(footerObj);
            $(jq).datagrid('reloadFooter', footerObj);
        }
        function sum(filed){
            var sumNum = 0;
            for(var i=0;i

　　

　　最后当DataGrid加载后，执行扩展方法：

onLoadSuccess: function (data) {
                    	//console.info(data);
                        $('#datagrid').datagrid('statistics'); //合计
                    } 

　　OK。

 

转载于:https://www.cnblogs.com/forlp/p/10765538.html