bootstrap table

$(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 的使用