bootstraptable 汇总_bootstrapTable插件：行内编辑，冻结列，导出，汇总行，列筛选...

还是接着上一篇文章的代码

1、行内编辑插件

引用行内编辑插件的相关文件

{# 行内编辑插件#}

// JS代码重新定义bootstrapTable

var url = 'https://examples.wenzhixin.net.cn/examples/bootstrap_table/data';

$("#table").bootstrapTable({

toolbar: '#toolbar', //自定义工具按钮

url: url, //请求后台的URL(*)

method: 'get', //请求方式(*)

cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性(*)

pagination: true, //是否显示分页(*)

pageSize: 10, //每页的记录行数(*)

pageList: [10, 20, 50, 100, 'unlimited'], //可供选择的每页的行数(*)

sidePagination: "server", //分页方式：client客户端分页，server服务端分页(*)

pageNumber: 1, //初始化加载第一页，默认第一页

columns: [

{

field: 'id',

title: 'ID',

}, {

field: 'name',

title: '姓名',

formatter: function (value, row, index) {

return '' + value + '';

}

}, {

field: 'price',

title: '价格'

},

], //列参数

// 单击事件

onClickRow: function (row, $element) {

curRow = row;

},

//渲染事件

onLoadSuccess: function () {

$("#table a").editable({

{#type: "text", //编辑框的类型。支持text|textarea|select|date|checklist等#}

{#title: "用户名", //编辑框的标题#}

type: "select", //编辑框的类型。支持text|textarea|select|date|checklist等

so