$('#table').bootstrapTable({
url: "http://localhost:8888/view", //服务器返回数据的网址
columns: columns,
pagination: true,
pageNumber: 1,
pageSize: 2,
pageList: [3, 5, 10, 20],
paginationHAlign: "left",
paginationDetailHAlign: "right",
// url: "http://localhost:8888/view", //服务器返回数据的网址
// method: 'GET', //数据请求方式
onLoadSuccess: function (data) {
mergeRow(data, 'version', 'table'); //table表格,合并version列
}
});
//设置需要显示的列
var columns = [
{
checkbox: true
},
{
field: 'version',
title: '版本',
sortable: true,
align: "center",
},
{
field: 'time',
title: '时间',
sortable: true,
align: "center",
},
{
field: 'select',
title: '下拉框',
sortable: true,
align: "center",
}
];
function mergeRow(data, fieldName, tableId) {
if (data.length == 0) {
return;
}
let left = 0;
for (var i = 1; i < data.length; i++) {
if (data[left][fieldName] != data[i][fieldName]) {
$('#' + tableId).bootstrapTable('mergeCells', {
index: left,
field: fieldName,
colspan: 1,
rowspan: i - left
});
left = i;
}
// 如果后两个数相同的情况,上述逻辑会少执行一次$('#'+tableId).bootstrapTable('mergeCells'...,
if (i == data.length - 1) {
$('#' + tableId).bootstrapTable('mergeCells', {
index: left,
field: fieldName,
colspan: 1,
rowspan: data.length - left
});
}
}
}
图片效果: