bootstrap table的使用

$(function(){
    datatable.init_Table("job_list_table","/test","get");
});
var datatable = {
    init_Table: function (tablePosition,url,method) {
        $("#"+tablePosition).bootstrapTable({ // 对应table标签的id
            url: url,// 获取表格数据的url
            method: method,//请求方式（*）
            dataType: "json",//返回数据的格式
            cache: false,// 设置为 false 禁用 AJAX 数据缓存， 默认为true
            striped: true,//表格显示条纹，默认为false
            locale:‘zh-CN‘,//中文支持
            undefinedText: "-",//当数据为 undefined 时显示的字符。
            pagination: true,// 在表格底部显示分页组件，默认false
            pageList: [10,20],// 设置页面可以显示的数据条数
            pageSize: 10,// 页面数据条数
            pageNumber: 1,// 首页页码
            sidePagination: ‘server‘,// 设置为服务器端分页
            queryParams: function (params) {  // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
                return {
                    pageSize: params.limit,// 每页要显示的数据条数
                    offset: params.offset,// 每页显示数据的开始行号
                    sort: params.sort,// 要排序的字段
                    sortOrder: params.order,// 排序规则
                    request_type: "job_list",
                    status: $("#status").val()//自定义查询条件
                }
            },sortName: ‘createTime‘,// 要排序的字段
            sortOrder: ‘desc‘,// 排序规则
            columns: [
                {
                    field: ‘id‘,title: ‘序号‘,// 表格表头显示文字
                    align: ‘center‘,// 左右居中
                    valign: ‘middle‘,// 上下居中
                    formatter: function (value,row,index) {
                        return index+1;
                    }
                },{
                    field: ‘jobid‘,// 返回json数据中的name
                    title: ‘ITSM单号‘,// 左右居中
                    valign: ‘middle‘ // 上下居中
                },{
                    field: ‘sysname‘,title: ‘系统名‘,align: ‘center‘,valign: ‘middle‘
                },{
                    field: ‘configType‘,title: ‘变更类型‘,{
                    field: ‘createTime‘,title: ‘创建时间‘,{
                    field: ‘creator‘,title: ‘创建人‘,{
                    field: ‘flag‘,title: ‘状态‘,{
                    field: ‘jobstep01‘,title: ‘核查‘,{
                    field: ‘id‘,title: "操作",valign: ‘middle‘,width: 160,// 定义列的宽度，单位为像素px
                    formatter: function (value,index) {
                        var chakan = ‘<button class="btn btn-primary btn-xs" onclick="getJobDetail(‘‘ + row.id + ‘|‘ + row.jobid + ‘‘)">查看</button>‘;
                        var shanchu  = ‘<button class="btn btn-primary btn-xs" onclick="delJob(‘‘ + row.id + ‘‘)">删除</button>‘;
                        return chakan + "&nbsp;&nbsp;" + shanchu
                    }
                }
            ],formatLoadingMessage: function () {
               return "请稍等，正在加载中...";
            },formatNoMatches: function () {
                return ‘无符合条件的记录‘;
            }
        });
    }
}

$("#job_list_table").bootstrapTable(‘refresh‘);