Layui数据表合计(totalRow)功能,模板(templet)情况下计算求和

您所在的位置:网站首页 合计表格模板 Layui数据表合计(totalRow)功能,模板(templet)情况下计算求和

Layui数据表合计(totalRow)功能,模板(templet)情况下计算求和

2023-07-05 00:08| 来源: 网络整理| 查看: 265

方法一

table.render({ elem: ‘#demp’ ,url: ‘’ ,parseData: function(res){ //res 即为原始返回的数据 layui.each(res,function(i,d){ d.sum =d.unitPrice * d.amount;//sum 是自定义的属性 }) return res; },cols: [[ {field:‘sum’, title: ‘自定义’, width: 200 } ,{field:‘id’, title:‘ID’, width:100} ]] //,…… //其他参数 });

方法二

table.render({ totalRow: true //开启合计行 ,cols: [[ //表头 {field: ‘experience’, title: ‘积分’, width: 90, sort: true, totalRow: true} ,{field: ‘score’, title: ‘评分’, width: 80, sort: true, totalRow: true} ,{field: ‘onwance’, title: ‘结算后余额’, width: 80, sort: true, totalRow: true,templet:function(d){ return Number(d.experience) - Number(d.score); }} ]] ,done:function(res){ var onwanceTotal=0;//统计结算后余额 layui.each(res.data,function(index,d){ onwanceTotal+=Number(d.experience) - Number(d.score) }) //修改 结算后余额 统计单元格文本 this.elem.next().find(’.layui-table-total td[data-field=“onwance”] .layui-table-cell’).text(onwanceTotal) } });



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3