$(document).ready(function(){
var queryParams = function (params) {
var temp = { //这里的键的名字和控制器的变量名必须一直,这边改动,控制器也需要改成一样的
limit: params.limit, //页面大小
offset: params.offset, //页码
name: $("#queryTxt").val()
};
return temp;
};
$(‘#tb_userList‘).bootstrapTable({
url: ‘getDiscUserList‘,
method: ‘post‘,
contentType : "application/x-www-form-urlencoded",
toolbar: ‘#toolbar‘, //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
pagination: true, //是否显示分页(*)
sortable: true, //是否启用排序
sortOrder: "asc", //排序方式
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
idField : ‘id‘,
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: 10, //每页的记录行数(*)
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
minimumCountColumns: 3, //最少允许的列数
queryParams: queryParams,//传递参数(*)
clickToSelect: true, //是否启用点击选中行
uniqueId: "id", //每一行的唯一标识,一般为主键列
cardView: false, //是否显示详细视图
detailView: false, //是否显示父子表
singleSelect:true,
columns: [{
checkbox: true
}, {
field: ‘userOid‘,
title: ‘编号‘
}, {
field: ‘realName‘,
title: ‘真实名称‘
}, {
field: ‘company‘,
title: ‘公司‘
} ,{
field: ‘industry‘,
title: ‘行业‘
},{
field: ‘occupation‘,
title: ‘职业‘
},{
field: ‘email‘,
title: ‘邮箱‘
},{
field: ‘phone‘,
title: ‘电话‘
},{
field: ‘remark‘,
title: ‘备注‘
},{
field: ‘operator‘,
title: ‘操作‘,
formatter : function(value,row,index){
//TODO
var d = ‘<a class="delete_user" >删除</a> ‘;
d = d + ‘<a class="active_user" >激活</a> ‘;
d = d + ‘<a class="freeze_user" >冻结</a> ‘;
return d;
},events:{
‘click .delete_user‘:function (e,value,row,index){
$.util.ajax({
url : ‘delDiscUser?userOid=‘+row.userOid,
type : ‘POST‘,
dataType : ‘html‘,
success : function (data) {
console.log(data);
if(data=="success"){
layer.msg(‘删除成功‘);
$("#tb_userList").bootstrapTable(‘refresh‘,{url:‘getDiscUserList‘});
}else {
layer.open({
content:‘删除失败‘
});
}
}
});
},
‘click .active_user‘:function (e,value,row,index){
$.util.ajax({
url : ‘‘,
type : ‘POST‘,
dataType : ‘html‘,
success : function (data) {
console.log(data);
if(data=="success"){
layer.msg(‘激活成功‘);
$("#tb_userList").bootstrapTable(‘refresh‘,{url:‘‘});
}else {
layer.open({
content:‘激活失败‘
});
}
}
});
}
}
}
],
//pagination:true
});
});
$("#btn_query").click(function(){
$("#tb_userList").bootstrapTable(‘refresh‘,{url:‘getDiscUserList‘});
});
bootstrap table 的使用
原文:http://www.cnblogs.com/FakerWang/p/7062178.html