官網：

http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/

後端分頁問題：後端返回”rows”、“”total，這樣才能重新賦值

先初始化表格

$(‘#my-table‘).bootstrapTable({
        method:‘POST‘,
        dataType:‘json‘,
        contentType: "application/x-www-form-urlencoded",
        cache: false,
        striped: true,                              //
 
是否顯示行間隔色
        sidePagination: "server",           //分頁方式：client客戶端分頁，server服務端分頁（*）
        url:url,
        height: $(window).height() - 110,
        width:$(window).width(),
        showColumns:true,
        pagination:true,
        queryParams : queryParams,
        minimumCountColumns:2,
        pageNumber:
 
1,        //初始化加載第一頁，默認第一頁
        pageSize: 20,            //每頁的記錄行數（*）
        pageList: [10, 25, 50, 100],       //可供選擇的每頁的行數（*）
        uniqueId: "id",      //每一行的唯一標識，一般為主鍵列
        showExport: true,                    
        exportDataType: ‘all‘,
        responseHandler: responseHandler,
        columns: [
        {
            field: 
 
‘‘,
                    title: ‘Sort No.‘,
                    formatter: function (value, row, index) {
                    return index+1;
             }
        },
        {
            field : ‘id‘,
            title : ‘User ID‘,
            align : ‘center‘,
            valign : ‘middle‘,
            sortable : true
        }]
    });
}

//設置查詢參數
function queryParams(params) {
    var param = {
       
        limit : this.limit, // 頁面大小
        offset : this.offset, // 頁碼
        pageindex : this.pageNumber,
        pageSize : this.pageSize
    }
    return param;
} 

做一些操作需要 更新表格數據 用refresh

$(‘#my-table’).bootstrapTable(‘refresh’,{ ...});

不止更新數據還需要更新些配置時用refreshOptions--不要用destroy()

$(‘#my-table’).bootstrapTable(‘refreshOptions’,{**});//

-------------------API------------------------------------------

表格參數

表格的參數定義在 jQuery.fn.bootstrapTable.defaults。

表格的參數定義在 jQuery.fn.bootstrapTable.defaults。

            function customSearch(text) {
                //Search logic here.
                //You must use `this.data` array in order to filter the data. NO use `this.options.data`.
            }
            

            function customSort(sortName, sortOrder) {
                //Sort logic here.
                //You must use `this.data` array in order to sort the data. NO use `this.options.data`.
            }
            

列參數

The column options is defined in jQuery.fn.bootstrapTable.columnDefaults.

事件

方法

使用方法的語法：$(‘#table‘).bootstrapTable(‘method‘, parameter);。

eg.

$table.bootstrapTable(‘updateRow‘, {index: 1, row: row});

$table.bootstrapTable(‘showRow‘, {index:1});
$table.bootstrapTable(‘hideRow‘, {index:1});

$table.bootstrapTable(‘getSelections‘);

$table.bootstrapTable(‘load‘, data);//Load the data to table, the old rows will be removed

myId

bootstrap Table API和一些簡單使用方法