DataTablesUtil提供的分页查询默认是web端分页,即在数据库中查询所有的数据之后,再根据需要进行分页查询,这样带来的后果就是如果某个表的数据量比较大则会给服务器带来较大的负担。DataTablesUtil是支持服务端分页的。
下面是一个Table:
<table class="table table-border table-bordered table-bg display" id="school">
<thead>
<tr>
<th scope="col" colspan="9">学校列表</th>
</tr>
<tr class="text-c">
<th width="3px" orderable="false" text-align="center"><input type="checkbox" name="allChecked"/></th>
<th width="40">学校编号</th>
<th width="150">学校名称</th>
<th width="90">城市</th>
<th width="150">省会</th>
</tr>
</thead>
</table>
加载该table的语句:
$("#school").DataTable({
ajax:{
url: url
},
"serverSide": true,
"destroy": true,
"pageLength": 10,
"ordering": false,
"autoWidth": true,
"stateSave": false,
"searching": true,
columns:[
{
orderable: false,
targets: [0],
data: "schoolId",
render: function(data, type, full, meta){
return '<input type="checkbox" name="id"/>';
}
},
{data: 'schoolId'},
{data: 'schoolName'},
{data: 'city'},
{data: 'province'}
]
});
serverSide:是否服务器端进行分页;
stateSave用于配置是否保存翻页状态。
在服务器端获取的JSON数据包含以下几个字段:
draw:用于表示当前页是哪一页;
length:用于表示分页长度;
start:查询开始的行数;
search(可用Map类型接收):search[value]表示搜索框输入的内容,所搜索框没有输入内容,则此值为空。
服务器返回值必须包含以下几个字段:
draw:用于表示当前页是哪一页;
recordsTotal:查询总数据量;
recordsFiltered:过滤数,类似mysql的limit
服务器端实现的Bean:
public class ResponseInfo<T> {
private List<T> data;
private int recordsTotal;
private int recordsFiltered;
private int draw;
//getter and setter
}
最终效果: