Bootstrap Table快速完美搭建后臺管理系統

 <div class="report-count">被舉報次數：${count}次</div>
 <ul class="report-btn nav nav-tabs" id="myTab" >
 <li class="pending active"><a href="#padding" onclick="freashTable(0)" data-toggle="tab">待處理：${stateCountList[0]}次</a><i class=""></i></li>
 <li class="success-report"><a href="#success-report" onclick="freashTable(1)" data-toggle="tab">舉報成立：${stateCountList[1]}次</a></li>
 <li class="fail-report"><a href="#fail-report" onclick="freashTable(2)" data-toggle="tab">舉報不成立：${stateCountList[2]}次</a></li>
 </ul>

<div class="table-view tab-content">
 <div class=" tab-pane fade in active" id="padding">
 <div class="table-header clear">
 <c:forEach items="${complainCount1}" varStatus="i" var="c" >
 <div>${c.complain_reason}：${c.count}次</div>
 </c:forEach>
 </div>
 <div class="line addStyle"></div>
 <div>
 <table class="table"></table>
 </div>
 </div>
 <div class="tab-pane fade" id="success-report">
 <div class="table-header clear">
 <c:forEach items="${complainCount2}" varStatus="i" var="c" >
 <div>${c.complain_reason}：${c.count}次</div>
 </c:forEach>
 </div>
 <div class="line addStyle"></div>
 <div>
 <table class="table"></table>
 </div>
 </div>
 <div class="tab-pane fade" id="fail-report">
 <div class="table-header clear">
 <c:forEach items="${complainCount3}" varStatus="i" var="c" >
 <div>${c.complain_reason}：${c.count}次</div>
 </c:forEach>
 </div>
 <div class="line addStyle"></div>
 <div>
 <table class="table"></table>
 </div>
 </div>
 </div> 

var $table=$('.table')
function initTable(index){
 $table.bootstrapTable({
 url: '${basePath}/interacts/complain/getComplainList?pkid='+$("#pkid").val()+'&state='+index, //請求數據地址url
 height: getHeight(), //獲取行高
 striped: true, //設置為 true 會有隔行變色效果
 search: true, //為true會有搜索框
 showRefresh: true, //為true有刷新按鈕
 showColumns: true, //是否顯示 內容列下拉框
 minimumCountColumns: 2,//當列數小于此值時，將隱藏內容列下拉框
 clickToSelect: true, //點擊行是checkbox或者rediobox選中
 detailView: true, //設置為 true 可以顯示詳細頁面模式。table第一行會有+號，點擊會出現更詳細的該行信息
 detailFormatter: 'detailFormatter', //格式化詳細頁面模式的視圖。
 pagination: true, //展示有分頁
 paginationLoop: false, //循環分頁
 sidePagination: 'server', //設置在哪里進行分頁，可選值為 'client' 或者 'server'。設置 'server'時，必須設置 服務器數據地址（url）或者重寫ajax方法
 silentSort: false, //設置為 false 將在點擊分頁按鈕時，自動記住排序項。僅在 sidePagination設置為 server時生效19 escape: true, //轉義HTML字符串，替換 &, <, >, ", `, 和 ' 字符.
 searchOnEnterKey: true, //設置為 true時，按回車觸發搜索方法，否則自動觸發搜索方法
 idField: 'systemId', //指定主鍵
 maintainSelected: true, //設置為 true 在點擊分頁按鈕或搜索按鈕時，將記住checkbox的選擇項
 toolbar: '#toolbar', //一個jQuery 選擇器，指明自定義的toolbar 
 columns: [
 {field: 'complain_reason', title: '舉報類型',align: 'center'},
 {field: 'nick_name', title: '舉報人',align: 'center'},
 {field: 'create_time', title: '舉報時間',formatter:'timeFormat' },
 {field: 'complain_state', title: '舉報狀態',formatter:'stateFormat'}
 {field: 'action', title: '操作', align: 'center', formatter: 'actionFormatter', events: 'actionEvents', clickToSelect: false}
 ]
 });
}