easyUI的汇总列,在前端生成

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyUI的汇总列,在前端生成相关的知识,希望对你有一定的参考价值。

1、easyUI初始化,启用汇总列,showFooter:true

2、后台json有默认的footer的值

{"total":28,"rows":[
    {"productid":"FI-SW-01","unitcost":10.00,"status":"P","listprice":36.50,"attr1":"Large","itemid":"EST-1"},
    {"productid":"K9-DL-01","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},
    {"productid":"RP-SN-01","unitcost":12.00,"status":"P","listprice":28.50,"attr1":"Venomless","itemid":"EST-11"},
    {"productid":"RP-SN-01","unitcost":12.00,"status":"P","listprice":26.50,"attr1":"Rattleless","itemid":"EST-12"},
    {"productid":"RP-LI-02","unitcost":12.00,"status":"P","listprice":35.50,"attr1":"Green Adult","itemid":"EST-13"},
    {"productid":"FL-DSH-01","unitcost":12.00,"status":"P","listprice":158.50,"attr1":"Tailless","itemid":"EST-14"},
    {"productid":"FL-DSH-01","unitcost":12.00,"status":"P","listprice":83.50,"attr1":"With tail","itemid":"EST-15"},
    {"productid":"FL-DLH-02","unitcost":12.00,"status":"P","listprice":63.50,"attr1":"Adult Female","itemid":"EST-16"},
    {"productid":"FL-DLH-02","unitcost":12.00,"status":"P","listprice":89.50,"attr1":"Adult Male","itemid":"EST-17"},
    {"productid":"AV-CB-01","unitcost":92.00,"status":"P","listprice":63.50,"attr1":"Adult Male","itemid":"EST-18"}
],"footer":[{"unitcost":合计,"listprice":0}]}

3、前台获取footer的值,然后修改,再刷新

 onLoadSuccess: function (data) {//表单加载完后再加载此方法
                sumline(data);
            }
//汇总列
        function sumline(data) {
            // var rows = $(‘#dg‘).datagrid(‘getRows‘)//获取当前的数据行
            var ptotal = 0//
            for (var i = 0; i < data.rows.length; i++) {
                ptotal += parseInt(data.rows[i].listprice);
            }
            //新增一行显示统计信息
            //$(‘#list‘).datagrid(‘appendRow‘, { strLearningDutyName: ‘<b>合计:</b>‘, trainingNum: ptotal, strTrainingTimes: utotal });
            var rows = $(‘#list‘).datagrid(‘getFooterRows‘);
            rows[0]["listprice"] = ptotal;
            $(‘#list‘).datagrid(‘reloadFooter‘);
        }

 

以上是关于easyUI的汇总列,在前端生成的主要内容,如果未能解决你的问题,请参考以下文章

easyui动态生成列

easyUi动态生成datagrid列

求教easyui datagrid如何动态生成列

easyUI属性汇总

easyui datagrid 使用技巧汇总

easyui datagrid 使用技巧汇总