bootstrap-table重载_BootstrapTable的使用教程

在开发项目的时候，发现了一款JS组件系列——表格组件神器

，官方文档也比较简单，总结了一些常遇到的问题

一：实现一个简单的表格和分页

图片.png

Dashboard | Nadhif - Responsive Admin Template

$('#mytab').bootstrapTable({

url: 'data1.json',

queryParams: "queryParams",

toolbar: "#toolbar",

sidePagination: "true",

striped: true, // 是否显示行间隔色

//search : "true",

uniqueId: "ID",

pageSize: "5",

pagination: true, // 是否分页

sortable: true, // 是否启用排序

columns: [{

field: 'id',

title: '登录名'

},

{

field: 'name',

title: '昵称'

},

{

field: 'price',

title: '角色'

},

{

field: 'price',

title: '操作',

width: 120,

align: 'center',

valign: 'middle',

formatter: actionFormatter,

},

]

});

//操作栏的格式化

function actionFormatter(value, row, index) {

var id = val