jquery datatables 翻页 用法

前台html代码

 <table id="list-table" width="100%" border="0" cellpadding="0" cellspacing="0" class="list_table" style="width: 1800px; table-layout: fixed;"> <thead id="list-head"> <tr> <th>生成时间</th> <th>模式</th> <th>模式细分</th> <th>操作</th> </tr> </thead> <tbody id="list-body"></tbody> </table>

前端js调用如下：

$(function() {$('#query-connection').click(function() {doSearch();});});function doSearch() {var targetLink = '';var currentHref = window.location.protocol + '//' + window.location.host;var prefixHref = getPrefixHref(currentHref);var mediaSource = $('#media-source').val();var mediaPort = $('#media-port').val();$('#list-table').dataTable({'bProcessing': true,'bDestroy': true,'bServerSide': true,//服务端处理'bPaginate': true,//分页按钮'bFilter': false,//不显示搜索'bLengthChange': false,'iDisplayLength': 10,'sPaginationType': 'full_numbers',// 分页，一共两种样式 另一种为two_button datatables默认'sAjaxSource': '/app/sdk/querySDKContents.json',"oLanguage": {"sLengthMenu": "每页显示 _MENU_条","sZeroRecords": "没有找到符合条件的数据","sProcessing" : '正在加载数据...',//显示中文的正在加载数据"sInfo": "当前第 _START_ - _END_ 条　共计 _TOTAL_ 条","sInfoEmpty": "木有记录","sInfoFiltered": "(从 _MAX_ 条记录中过滤)","oPaginate": {"sFirst": "首页","sPrevious": "前一页","sNext": "后一页","sLast": "尾页"}},'fnServerParams': function(aoData) {aoData.push({'name': 'mediaSource', 'value': mediaSource},{'name': 'mediaPort', 'value': mediaPort});},'aoColumns': [              {'mData': 'xx'},  //后台返回给前台变量              {'mData': 'xx'},              {'mData': 'xx'},              {'mData': null}              ],'aoColumnDefs': [               {               'aTargets': [14],               'fnRender': function(data) {               targetLink = prefixHref + data.aData.link;               return '<input type="button" onclick="copyLink(\'' + targetLink + '\')" value="复制长链接" /><br/>' +                '<input type="button" onclick="createQRCode(\'' + targetLink + '\')" value="生成二维码" />';               }               }               ],//使用post方式'fnServerData': function(sSource, aoData, funCallback) {$.ajax({'url': sSource,'data': {aoData: JSON.stringify(aoData)},'type': 'post','dataType': 'json','success': function(msg) {if ('002' == msg.resultCode) {alert('系统内部错误，请稍候查询！');}funCallback(msg);}});}});}

后台java代码

@RequestMapping(value = "/app/sdk/queryContents")public Object queryContents(@RequestParam(value = "aoData") String aoData,//datatables框架封装的值@TransferContextContainerAnnotation TransferContextContainer transferContext) {logger.trace("----->>> 进入queryontents方法！");Map<String, Object> params = this.getParamsMap(aoData);String mediaSource = (String) params.get("mediaSource");String mediaPort = (String) params.get("mediaPort");Integer pageSize = (Integer) params.get("pageSize");Integer pageNum = (Integer) params.get("displayStart") / pageSize + 1;Object sEcho = params.get("sEcho");Map<String, Object> result = new HashMap<String, Object>();Map<String, Object> queryContent = this.createQueryCondition(mediaSource, mediaPort);int totalCounts = this.contentManagerService.queryTotalCounts(sdkQueryContent);List<Map<String, Object>> lstESBContents = this.managerService.queryContents(pageNum, pageSize, queryContent);List<ContentDTO> lstContents = this.transferESBContentToContent(lstESBContents);if (null == lstESBContents) {totalCounts = 0;result.put("resultCode", ResultCode.ERROR_BISNUESSEXCEPTION);} else {result.put("resultCode", ResultCode.SUCCESS_DONE);}result.put("sEcho", sEcho);result.put("iTotalRecords", totalCounts);result.put("iTotalDisplayRecords", totalCounts);result.put("aaData", lstContents);logger.trace("返回给前台的数据： " + JSONObject.fromObject(result).toString());return result;}