spring下DataTable服務器分頁
阿新 • • 發佈:2017-09-02
parseint pro result 獲取 images getcount width sonar put
JSP中body內容:
<table class="table table-border table-bordered table-bg table-hover table-sort"> <thead> <tr class="text-c"> <th width="80">ID</th> <th width="100">類型</th> <th>內容</th> <th width="17%">用戶名</th> <th width="120">客戶端IP</th> <th width="120">時間</th> <!-- <th width="70">操作</th> --> </tr> </thead> </table>
JS內容:
$(‘.table-sort‘).dataTable({ "bProcessing": false, // 是否顯示取數據時的那個等待提示 "bServerSide": true,//這個用來指明是通過服務端來取數據 "bPaginate": true, //是否顯示分頁 "sAjaxSource": "${cxtPath}/globalLog/getList",//這個是請求的地址 "fnServerData": retrieveData, // 獲取數據的處理函數 "aoColumns": [ { "mData": "id"}, { "mData": "type"}, { "mData": "info"}, { "mData": "userName"}, { "mData": "ip"}, { "mData": "time"} ] //對應表格中的每一列 }); function retrieveData( sSource111,aoData111, fnCallback111) { $.ajax({ url : sSource111,//這個就是請求地址對應sAjaxSource data : {"aoData":JSON.stringify(aoData111)},//這個是把datatable的一些基本數據傳給後臺,比如起始位置,每頁顯示的行數 type : ‘post‘, dataType : ‘json‘, async : false, success : function(result) { fnCallback111(result);//把返回的數據傳給這個方法就可以了,datatable會自動綁定數據的 }, error : function(msg) { } }); }
java代碼:
1 @RequestMapping(value = "/getList") 2 @ResponseBody 3 public String getList(@RequestParam String aoData) { 4 JSONArray jsonarray=(JSONArray) JSONArray.parse(aoData); 5 6 String sEcho = null; 7 int iDisplayStart = 0; // 起始索引 8 int iDisplayLength = 10; //每頁顯示的行數 9 10 for (int i = 0; i < jsonarray.size(); i++) { 11 JSONObject obj = (JSONObject) jsonarray.get(i); 12 if (obj.get("name").equals("sEcho")) 13 sEcho = obj.get("value").toString(); 14 15 if (obj.get("name").equals("iDisplayStart")) 16 iDisplayStart =Integer.parseInt(obj.get("value").toString()); 17 18 if (obj.get("name").equals("iDisplayLength")) 19 iDisplayLength = Integer.parseInt(obj.get("value").toString()); 20 } 21 22 23 JSONObject getObj = new JSONObject(); 24 getObj.put("sEcho", sEcho);// DataTable前臺必須要的 25 getObj.put("iTotalRecords",globalLogService.getCount());//實際的行數,調用查詢總記錄數的方法 26 getObj.put("iTotalDisplayRecords",globalLogService.getCount());//顯示的行數,這個要和上面寫的一樣 27 28 getObj.put("aaData", globalLogService.getList(iDisplayStart, iDisplayLength));//把查到數據裝入aaData,要以JSON格式返回 29 return JSONObject.toJSONString(getObj); 30 }
效果圖:
spring下DataTable服務器分頁