//表格
<table id="table" data-mobile-responsive="true">
//这段必须放在表格初始化之前。
function addFunctionAlty(value, row, index) {
return [
'<button id="bind" type="button" class="btn btn-default">绑定</button>',
'<button id="unbind" type="button" class="btn btn-default">解绑</button>',
].join('');
}
window.operateEvents = {
'click #bind': function (e, value, row, index) {
alert(row.qxxh);
$("#upload").modal('show');
}, 'click #unbind': function (e, value, row, index) {
alert(row.qxxh);
$("#upload").modal('show');
}
};
// 表格初始化
$('#table').bootstrapTable({
pagination: true,
showColumns: true,
pageSize: 10,
pageNumber: 1,
pageList: [10, 25, 50],
showRefresh: true,
smartDisplay: false,
singleSelect: true, // 单选checkbox
clickToSelect: true,
uniqueId: 'id',
method: 'get',
url: '/sys/netbar/manage/list/data',
dataType: 'json',
sidePagination: 'server',
toolbar: '#toolbar',
queryParams: function (params) {
var params = {
offset: params.offset, //数据起始
limit: params.limit, //偏移量
netbarName: $("#netbarName").val(),
netbarNo: $("#netbarNo").val(),
areaCode: $("#areaCode").val()
};
return params;
},
columns: [{
checkbox: true
}, {
field: 'netbarNo',
title: '网吧编号',
}, {
field: 'name',
title: '网吧名称',
}, {
field: 'manager',
title: '负责人',
}, {
field: 'phone',
title: '手机号',
}, {
field: 'createTimeStr',
title: '创建时间',
}, {
field: 'address',
title: '地址',
}, {
field: 'operate',
title: '操作',
events: operateEvents,//给按钮注册事件
formatter: addFunctionAlty//表格中增加按钮
}]
});
//效果如下