•首先给table添加属性：
showFooter: footer
js代码如下：
//初始化bootstrapTable
initBootstrapTable: function () {
var oTable = new TableInit("/manage/report/merchant/page", true);
oTable.Init();
showTotal();
$("#btn_query").click(function () {
$("#bootstrapTable").bootstrapTable('refresh', TableInit);
showTotal();
});
function showTotal(){
var params = {};
var param = $("#searchForm").serializeArray();
for (var p in param) {
if (param[p].value != '') {
params[param[p].name] = param[p].value;
}
}
$.ajax({
type: "get",
url: "/manage/report/merchant/total",
data: params,
success: function (data) {
var reportTerDay = data.reportTerDay;
saleTickets = reportTerDay.saleTickets;
saleMoney = reportTerDay.saleMoney;
winTickets = reportTerDay.winTickets;
winMoney = reportTerDay.winMoney;
bigTickets = reportTerDay.bigTickets;
bigMoney = reportTerDay.bigMoney;
proxyMoney = reportTerDay.proxyMoney;
$("#saleTickets").text(reportTerDay.saleTickets + "张");
$("#saleMoney").text(reportTerDay.saleMoney + "元");
$("#winTickets").text(reportTerDay.winTickets + "张");
$("#winMoney").text(reportTerDay.winMoney + "元");
$("#bigTickets").text(reportTerDay.bigTickets + "张");
$("#bigMoney").text(reportTerDay.bigMoney + "元");
$("#proxyMoney").text(reportTerDay.proxyMoney + "元");
},
});
}
function columnsDefined() {
detailView: true
return [
{
title: '商户名称',
field: 'merName',
align: 'center',
footerFormatter: function (value) {
return "总计";
}
},
{
title: '网点名称',
field: 'networkName',
align: 'center',
footerFormatter: function (value) {
return "-";
}
}, {
title: '终端编号',
field: 'termId',
align: 'center',
footerFormatter: function (value) {
return "-";
}
},
{
title: '玩法名称',
field: 'chineseName',
align: 'center',
footerFormatter: function (value) {
return "-";
}
},
{
title: '销售票数(张)',
field: 'saleTickets',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + saleTickets + "张";
}
}, {
title: '销售金额(元)',
field: 'saleMoney',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + saleMoney +"元";
}
}, {
title: '中奖票数(张)',
field: 'winTickets',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + winTickets + "张";
}
},
{
title: '中奖金额(元)',
field: 'winMoney',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + winMoney +"元";
}
},
{
title: '大奖票数(张)',
field: 'bigTickets',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + bigTickets + "张";
}
},
{
title: '大奖金额(元)',
field: 'bigMoney',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + bigMoney +"元";
}
},
{
title: '结算金额(元)',
field: 'proxyMoney',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "" + proxyMoney +"元";
}
},{
title: '统计时间',
field: 'statsDate',
align: 'center',
sortable: true,
footerFormatter: function (value) {
return "-";
}
}
];
};
最后效果图如下：
如果觉得《html table 合计 bootstrap-table 页脚总计(自定义统计总数)》对你有帮助，请点赞、收藏，并留下你的观点哦！
