Datatables(1.10以上版本)服务器端分页(Java)

Html：

<table class="table table-striped table-bordered table-hover table-condensed" id="ou-table">
	<thead>
		<tr>
		  <th>序号</th>
		  <th>名称</th>
                  <th>部门领导</th>
                  <th>标识</th>
                  <th>上级组织</th>
		  <th>操作</th>
		</tr>
	</thead>
	<tbody>
	</tbody>
</table>

js：

 $('#ou-table').dataTable({
        "processing": true,
        "serverSide": true,//启用服务器端分页
        "destroy": true,
        "pageLength": 10,
        "ordering": false,
        // "renderer": "bootstrap",//渲染样式：Bootstrap和jquery-ui
        "pagingType": "simple_numbers",//分页样式：simple,simple_numbers,full,full_numbers
        "autoWidth": true,
        "stateSave": true,//保持翻页状态，和comTable.fnDraw(false);结合使用
        "searching": true,//datatables默认搜索
        "ajax": {
            "url": "/ou/getOus",
            "type": 'POST',
            "data": function (d) {
                var param = {};
                param.draw = d.draw;
                param.start = d.start;
                param.length = d.length;
                param.search=d.search.value;
                param.ou=ou;
                return param;//自定义需要传递的参数。
            },
            "dataSrc": function (str) {
                var data;
                if (typeof str === 'object') {
                    data = str;
                }
                else {
                    data = eval("(" + str + ")");
                }
                var datas=data.data;
                for(var i=0,l=datas.length;i<l;i++){
                    if(!datas[i].hasOwnProperty("managedBy")){
                        datas[i].managedBy="";
                    }
                }
                return str.data;
            }
        },
        "columns": [
            {"data": null},
            {"data": "name"},
            {"data": "managedBy"},
            {"data": "uid", "visible": false},
            {"data": "pid"},
            {"data": null}
        ],
        columnDefs: [
            {
                targets: 0,
                defaultContent: "<input type='checkbox' name='checkList'>"
            },
            {
                targets: -1,
                defaultContent: "<div class='btn-group'>"+
                "<button id='oueditRow' class='btn btn-primary btn-sm' type='button'><i class='glyphicon glyphicon-user'></i></button>"+
                "<button id='oudelRow' class='btn btn-primary btn-sm' type='button'><i class='glyphicon glyphicon-edit'></i></button>"+
                "</div>"
            }
        ],
        //在每次table被draw完后调用
        fnDrawCallback: function(){
            var api = this.api();
            //获取到本页开始的条数
            var startIndex= api.context[0]._iDisplayStart;
            api.column(0).nodes().each(function(cell, i) {
                cell.innerHTML = startIndex + i + 1;
            })
        },
        "language": {
            "lengthMenu": "每页 _MENU_ 条记录",
            "processing": "数据加载中...",
            "paginate": {
                "previous": "上一页",
                "next": "下一页"
            },
            "zeroRecords": "没有找到符合条件的数据",
          //  "info": "第 _PAGE_ 页 ( 总共 _PAGES_ 页 )",
            "info": "当前显示第 _START_ 到 _END_ 项, 共 _TOTAL_ 项",
            "infoEmpty": "无记录",
            "infoFiltered": "(从 _MAX_ 条记录过滤)",
            "search": "搜索："
        }

    });

后台：

 @RequestMapping(value="/getOus",produces = "text/json;charset=UTF-8")
    @ResponseBody
    public JSONObject getOus(HttpServletRequest request, QueryCondition query){
        System.out.println(query.toString());
        List<OU> ous=ouService.getOuByQuery(query);
        DatatablesView<OU> dataTable=new DatatablesView<>();
        dataTable.setDraw(query.getDraw());
        dataTable.setRecordsFiltered(ouService.getOuSize(query));
        dataTable.setRecordsTotal(ouService.getOuSize(query));
        dataTable.setData(ous);
       // String data = JSON.toJSONString(dataTable);
       // System.out.println(data.toString());
        JSONObject data=(JSONObject)JSON.toJSON(dataTable);
        System.out.println(data.toString());
        return data;
    }

public class DatatablesView<T> {
    private List<T> data; //data 与datatales 加载的“dataSrc"对应

    private int recordsTotal;

    private int recordsFiltered;

    private int draw;

    public DatatablesView() {
    }

recordsTotal、recordsFiltered、draw必须返回给前台,query是前台自定义的参数，当然可以通过request获取datatables默认的参数

出现过下面这种情况，是后台返回的是string，前台接收后解析格式不对，后来改成后台返回json解决

如果出现页码只有一页实际有多页的问题，recordsTotal、recordsFiltered参数值应该是总的查询条数，而非过滤的条数

返回前台的数据格式

{"recordsFiltered":15,"data":[ 
   {"uid":"","name":"拆迁管理中心","pid":"","managedBy":""},
   {"uid":"","name":"审计监察中心","pid":","managedBy":""},
   {"uid":"","name":"立项及专规申报中心","pid":"","managedBy":""},
   {"uid":"","name":"测试部1","pid":"","managedBy":""},
   {"uid":"","name":"测试部2","pid":"","managedBy":""}
 ],"draw":4,"recordsTotal":15}