网上也有干系的文档,文档支持中文。这是文档地址:
http://datatables.club/
下面我就开始先容下最基本的css与js引用了。

css部分 jquery.dataTables.css 与js部分 jquery.dataTables.js 、 jquery-1.10.2.min.js,
HTML中我们只须要一个带指定id的table标签就可以了,不用写php代码或者smarty一类的模板变量例如:
这样子减少了我们的php或者smarty的代码量,接下来便是我们js部分如图:
请点击此处输入图片描述
dataTable()方法中大括号部分便是这个插件的配置部分,此处我只先容主要部分,别的扩展大家可以查看在线中文文档。
对付后端来说处理数据才是主要的,首先开启dataTable 做事器模式 , 指定做事要求地址与要求类型 例:
serverSide: true,
ajax: {
url: \公众
www.demo.com\"大众,
type: \"大众POST\公众,
data: function (d) {
//codel...
}
},
【白银】W. 2017/3/24 11:22:17
在ajax中的data function 紧张浸染是通报要求参数。
格式为:
data: function (d) {
d.search.uid = uid;
d.search.groupId = groupId;
d.search.cityIds = cityIds;
}
或者
data: function (d) {
uid = uid;
groupId = groupId;
cityIds = cityIds;
}
当我们发送要求时对应的参数与值都会一起发送到做事端。我们无需做干系处理,这时我们须要到做事端处理我们吸收到的数据,根据客户真个要求返回数据。例如:
客户端要求发送的数据我们须要过滤下,客户端之前写的要求所带参数也会获取到这里就不一一举例解释了,做事端返回值必须是json格式的数据且有四个主要的字段必须返回
draw 客户端通报的原封不动的返回
recordsTotal 数据库里统共记录数
recordsFiltered 过滤后的记录数(如果有吸收到前台的过滤条件,则返回的是过滤后的记录数)
data 查询后的数据
操作数据翻页紧张是根据客户端通报的start、length两个参数,根据英文意思想必我不用解释大家都知道是怎么用的了吧。
得到数据后我们须要在客户端做下渲染处理。
也便是配置项中的columnDefs配置项
columnDefs 中的数据格式如下
{
data: '字段名(返回data数据列中的字段 例如 id )',
orderable: false, //关闭列排序 如果有兴趣可以自行研究
targets: 0,//编号从0 开始,必写。
title: '列标题名称',
render: function (data, type, row, meta) {
每一行显示处理你可以直接返回对应字段数据例如 return
row.id
也可以做点html润色 return ' <input value =\公众 '+
row.id+' \"大众> '
}
},
....code