bootstrap-table 前端分頁，重新整理事件代碼執行個體

function renderIssueTable(){
        $('#issueTable').bootstrapTable({
            detailView: false,//父子表
            //分頁方式：client 用戶端分頁，server服務端分頁（*）
            sidePagination: "client",
            pageNumber: 1,
            pageSize: 50,
            pageList: [50, 100, 200, 300],
            paginationHAlign: 'right', //right, left
            paginationVAlign: 'bottom', //bottom, top, both
            paginationDetailHAlign: 'left', //right, left
            paginationPreText: '‹',
            paginationNextText: '›',
            searchOnEnterKey: false,
            strictSearch: false,
            searchAlign: 'right',
            selectItemName: 'btSelectItem',
            //是否顯示搜尋
            search: true,
            url: 'listIssueOfRecent6Month',
            method: 'GET',
            striped: true,      //是否顯示行間隔色
            cache: false,      //是否使用緩存，預設為true，是以一般情況下需要設定一下這個屬性（*）
            pagination: true,     //是否顯示分頁（*）
            paginationLoop: false,
            silent: true,
            //是否啟用排序
            sortable: true,
            sortName: 'deptName',
            //排序方式
            sortOrder: "asc",
            contentType: 'application/json',
            dataType: 'json',
            // dataField: 'departmentIssueQualityDataList', //server 後端 : json 對應的表格資料 key
            responseHandler: function (res) {
                console.log(res)
                $('#issueTable').bootstrapTable('getOptions').data = res.result;
                return res;
            },
            // 缺陷建立時間（年月日）、缺陷ID、缺陷解決者、項目名稱、所屬産品線、深度、reopen次數、缺陷修複時長（取fixed_duration ）、嚴重程度、缺陷狀态、缺陷标題
            columns: [
                {
                    title: 'ID',
                    field: 'aoneIssueId',
                    align: 'left',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        var url = `https://aone.com/issue/${value}`;
                        return `<a href="${url}" target="_blank">${value}</a>`;
                    }
                },
                {
                    title: '标題',
                    field: 'subject',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        return value;
                    }
                },
                {
                    title: '狀态',
                    field: 'status',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        return value;
                    }
                },
                {
                    title: '項目',
                    field: 'aoneProjectId',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        var url = `https://aone.com/project/${value}`;
                        return `<a href="${url}" target="_blank">${value}</a>`;
                    }
                },
                {
                    title: '産品線',
                    field: 'aoneProductId',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        var url = `https://aone.com/project/${value}`;
                        return `<a href="${url}" target="_blank">${value}</a>`;
                    }
                },
                {
                    title: '修複時長（天）',
                    field: 'fixedDuration',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        if (value && value !== 0) {
                            value = (value/(60*60*24)).toFixed(2)
                        }
                        return value;
                    }
                },
                {
                    title: '解決者',
                    field: 'assignedToWorkno',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        var url = `https://aone.com/${value}`;
                        return `<a href="${url}" target="_blank">${value}</a>`;
                    }
                }, {
                    title: '嚴重程度',
                    field: 'seriousLevel',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        return value;
                    }
                }, {
                    title: 'reopen次數',
                    field: 'reopenTimes',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        return value
                    }
                }, {
                    title: '發現深度',
                    field: 'depth',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    formatter: (value, row, index) => {
                        return value
                    }
                }, {
                    title: '部門',
                    field: 'deptFullName',
                    align: 'center',
                    valign: 'middle',
                    sortable : true,
                    cellStyle: function (value, row, index) {
                        return {
                            css: {
                                "min-width": "100px",
                                "word-wrap": "break-word",
                                "word-break": "normal"
                            }
                        };
                    },
                    formatter: (value, row, index) => {
                        return value
                    }
                }
            ],
            queryParams: function (params) {
                params.deptNo = $("#searchDept").select2("val");
                return params
            },
            // 當表格加載完畢才可以綁定的事件
            onPostBody: (rows) => {

            }
        });
        $('#issueTable').bootstrapTable('refresh');
    }
           

參考文檔：

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