统计easyui datagrid某列之和显示在对应列下面

项目需求要在表格下面加一行统计求和的，结果网上搜寻了一堆，要么说的不详细，高深大牛们的见解；要么实现不了，搜寻老半天修改出一个可以用的，做一下学习记录，新手菜鸟，欢迎指正和新解决方案。

最终效果图：

JS代码

editcount = 0;
            var objTable=$("#personManage");
            objTable.datagrid({ pagination: true,
                                  pagePosition:'bottom',
                                  onLoadSuccess: compute,//加载完毕后执行计算
                                  fitColumns:false,
                                  enableHeaderClickMenu:false,
                                  singleSelect:false,
                                  autoRowHeight:true,
                                  nowrap:true,
                url:'${ctx}/cpv3QuotationCtrl/costGather?RndId='+Math.random(),
                loadFilter:pagerFilter,
                queryParams:buildParams(),
                toolbar:"#toolbar",
                rownumbers:true,
                showFooter: true,
                columns: [[
                    { field: 'EVAL', title: '费用类别', width:80,align:'center'},
                    { field: 'CON', title: '合同报价', width:80,align:'center'},
                    { field: 'PCOST', title: '成本预算', width:80,align:'center'},
                    { field: 'BOR', title: '预借款', width:80,align:'center'}
                ]]
              // fitColumns:true//自适应宽度、可以水平滚动
            });

 

 function compute() {//计算函数
            var rows = $('#personManage').datagrid('getRows')//获取当前的数据行
            var ptotal = 0//计算listprice的总和
            ,utotal=0//统计unitcost的总和
            ,btotal=0;//统计unitcost的总和
            for (var i = 0; i < rows.length; i++) {
                ptotal += rows[i]['CON'];
                utotal += rows[i]['PCOST'];
                btotal += rows[i]['BOR'];
            }
            //新增一行显示统计信息
            $('#personManage').datagrid('appendRow', { EVAL: '<b>统计：</b>', CON: ptotal, PCOST: utotal ,BOR : btotal});
        }

 

JSP页面

 

<table id="personManage">
     </table>