bootstrap table 实现底部合计

1、首先贴个效果图: 

bootstrap table 实现底部合计_第1张图片

 2、第二步来了,重点来了,开始吹水了。

// onLoadSuccess 应该都知道,是bootstrap table自己提供的
// 我想大家一看就明白, 加载成功之后。
// 就如下面的代码
onLoadSuccess:function(data){
    var _count = 0;
    if (data.rows.length != 0) {
        // data.rows 是一个数组数据,就像Java后台的List list一样
        for (var i = 0; i < data.rows.length; i++) {
            // _count += 怎么说呢, 不知道怎么解释?  其实我也不知道^ _ ^ 
            _count += data.rows[i].countFee;
        }
    }
    
    // 历史合计
    var hostCount = queryDailyCountFee();
			
    // 只有一页,并且数据Size小于每页分页大小时需要追加到_page_info
    // 10 是每页最小Size  因为样式有点不一样
    // .page-list 和 pagination-info 是bootstrap table 底部一个class,不知道的可以检查元素
    // emmmm............
    var _page_info = $('.pagination-info')[0];
    var _page_list = $('.page-list')[0];
    if (data.rows.length < 10) {
        _page_info.append('。当页合计: '+(Math.floor(_count * 100) / 100)+'元。 ');
        _page_info.append('历史合计: '+(Math.floor(hostCount * 100) / 100)+'元 。');
    } else if (data.rows.length >= 10) {
        _page_list.append('。当页合计: '+(Math.floor(_count * 100) / 100)+'元 。');
        _page_list.append('历史合计: '+(Math.floor(hostCount * 100) / 100)+'元 。');
    }

}

 

你可能感兴趣的:(bootstrap table 实现底部合计)