bootstrapTable使用小结

项目中使用bootstrapTable展示表格，记录开发过程中遇到的问题，以便查询；
参考官网：https://examples.bootstrap-table.com/#methods/append.html

自定义加载数据，原有的数据会被删除

$table.bootstrapTable('load', data)

插入一条行数据

\(table.bootstrapTable('insertRow', {index: 0, row: { id: randomId, name: 'Item ' + randomId, price: '\)' + randomId
}})

获取表格数据

$table.bootstrapTable('getData')

获取选中的数据

$table.bootstrapTable('getSelections')

删除数据

var ids = \(.map(\)table.bootstrapTable('getSelections'), function (row) {
return row.id
})
$table.bootstrapTable('remove', {
field: 'id',
values: ids
})

父页面打开子页面（弹窗）

layer.open({
type: 2,
content: 'add.html' //可以是同级目录的页面
});

子页面（弹窗）传值到父页面

let row = $("#test").bootstrapTable('getSelections');//获得选中的行数据
window.parent.doCallback(row);//doCallback(row)是在父页面定义的方法，可以处理得到的row数据

//关闭弹窗
let index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);

js传递List数据到后端

let array = [];
let user1 = {"id": 1, "name": "huage"};
let user2 = {"id": 2, "name": "heihei"};
array.push(user1);
array.push(user2);
let data = {"userList": array};

$.ajax({
type: 'post',
url: url,
data: JSON.stringify(data),
dataType: 'json',
contentType: 'application/json',
success: function(result){

}
})

//后端处理
public Result handler(@RequestBody InfoVo vo){

}

public class InfoVo{
private List userList;//跟js的data中参数名称对应
}