bootstraptable汇总_bootstrap-Table统计求和footerFor。。。
1.表格很好，有的时候需求和，然后bootstrap-table 默认是关闭 footer的，所以表格不显⽰footer也就是最后⼀⾏
2.我们需要在表格初始化的时候打开footer选项 showFooter:truevar Controller = {
index: function () {
// 初始化表格参数配置
Table.api.init({
showFooter:true,
extend: {
index_url: 'cneed/index',
add_url: 'cneed/add',
edit_url: 'cneed/edit',
前端页面模板del_url: 'cneed/del',
multi_url: 'cneed/multi',
table: 'lvdate',
}
});
3.在colums⾥⾯ 将需要显⽰footer的列，加上footFormattercolumns: [
[ {title: '客户需求表',colspan: 14}],//这是第⼀⾏⼤标题
[
{checkbox: true,footerFormatter:function(data){
return '总计';//在第⼀列开头写上总计、统计之类
}
},
其中 footerFormatter：后⾯的 function 需要返回string 这是官⽅⼿册上说的
4.我们可以在需要的列进⾏计算，我这⾥纯是实验 所及计算了⼀下PID{field: 'PID', title: __('Pid'),sortable: true,footerFormatter: function (data) {
var field = this.field;
var total_sum = duce(function (sum, row) {
return (sum) + (parseFloat(row[field]) || 0);
}, 0);
return Fixed(2);
}
5.最终结果是这样
6.最终感谢 QQ：ID为：^阿茂-桂林 的⼤神 感谢关注 感谢耐⼼指导，祝你事业顺利，⾝体健康！
回答提问：当前统计整页的值，如何统计全部值并显⽰在前端呢？
1. 在控制器⾥⾯统计数据/**
* 查看
*/
public function index()
{
//当前是否为关联查询
$this->relationSearch = true;
//设置过滤⽅法
$this->request->filter(['strip_tags']);
if ($this->request->isAjax()) {
/
/如果发送的来源是Selectpage，则转发到Selectpage
if ($this->request->request('keyField')) {
return $this->selectpage();
}
list($where, $sort, $order, $offset, $limit) = $this->buildparams();
$total = $this->model
->where($where)
->order($sort, $order)
->count();
$list = $this->model
->where($where)
-
>order($sort, $order)
->limit($offset, $limit)
->select();
$sum['price']=0;//这⾥我们要统计的值是price 价格的合计，先定义⼀个变量值为0，⽤来保存统计的值foreach ($list as $row) {
$row->visible(['id', 'price', 'phone', 'spec', 'account_id', 'remark', 'createtime', 'updatetime', 'admin_id']); $sum['price']+=$row['price']//当然这⾥可以进⾏⼀些其他计算 如单价×价格 啥的 我这⾥简单的计算和
}
$list = collection($list)->toArray();
$result = array("total" => $total, "rows" => $list，"sum"=>$sum);//我们把$sum的值传单前端模板页⾯return json($result);
}
return $this->view->fetch();
}
前端模板页⾯我们在js中 接收值并⽤jquery去修改到相应位置上去，代码⽚段如下index: function () { // 初始化表格参数配置
Table.api.init({ //初始化表格
extend: {
index_url: 'grain/driver/detail',
table: 'grain_buy',
}
});
var table = $("#table");
<('load-success.bs.table', function (e, data) {//在表格数据加载成功后 data为数据
//统计核算显⽰到模板页⾯
$("#toolbar .total").remove(); //防着刷新后 ⽣成多余的统计单元
$("#toolbar").append('
'合计：'+data.sum.price+'元 ');//⽤js在按钮旁边加⼀个统计的单元 参照K神的demo
});
// 初始化表格
table.bootstrapTable({
url: $.fn.d.index_url,
pk: 'id',
sortName: 'id',
sortOrder:'asc',
columns: [
[{title: '运输明细表', colspan: 16,class:'Transport'}],
[
{checkbox: true},
{field: '', title: __('序号'), formatter: function (value, row, index) {
var options = table.bootstrapTable('getOptions');
var pageNumber = options.pageNumber;
var pageSize = options.pageSize;
return (pageNumber - 1) * pageSize + 1 + index;
}, operate: false},
{field: 'date', title: __('Date'), operate:'RANGE', addclass:'datetimerange'},

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。