方法一:ajax逐步封装
ajax: function (data, callback, settings){
//封装请求参数
var param = {};
param.limit = data.length;//页面显示记录条数,在页面显示每页显示多少项的时候
param.draw = data.draw;//开始的记录序号
param.start = data.start;//开始的记录序号
param.page = (data.start / data.length)+1;//当前页码
$.ajax({
url: baseurl,
dataSrc: 'data',
type: 'GET',
data: param,
dataType: 'json',
success: function(result) {
console.log(result);
//setTimeout仅为测试延迟效果
setTimeout(function() {
//封装返回数据
var returnData = {};
returnData.draw = data.draw; //这里直接自行返回了draw计数器,应该由后台返回
returnData.recordsTotal = result.data.recordsTotal; //返回数据全部记录
returnData.recordsFiltered =result.data.recordsFiltered; //后台不实现过滤功能,每次查询均视作全部结果
returnData.data = result.data.data; //返回的数据列表
//调用DataTables提供的callback方法,代表数据已封装完成并传回DataTables进行渲染
//此时的数据需确保正确无误,异常判断应在执行此回调前自行处理完毕
callback(returnData);
}, 200);
}
});
},
方法二 利用官网提供的事件封装
$('#example')
.on('xhr.dt', function ( e, settings, json, xhr ) {
//预处理从服务器返回的数据:
var data = json.data
json.draw = data.draw; //这里直接自行返回了draw计数器,应该由后台返回
json.recordsTotal = data.recordsTotal; //返回数据全部记录
json.recordsFiltered = data.recordsFiltered; //后台不实现过滤功能,每次查询均视作全部结果
json.data = data.data; //返回的数据列表
json.sumt = data.sumt; //返回的数据列表
// 注意没有返回-直接在JSON对象中操作数据
} )
.dataTable( {
ajax: "data.json" //下面正常请求
} );