Jquery Datatables 请求参数及接收参数处理
/**
* Created by wb-*fu on 2016/8/9.
*/
/**
* Created by wb-*fu on 2016/8/9.
*/
var $ = jQuery;
(function () {
var App = function () {
var self = this;
self = $.extend(this, {
api: {
ajax_list: '*****'
, url_monitor: '*****'
},
const:{
gridIndex : 0, // 表格索引序号
},
/**
* 应用初始化
*/
init: function () {
self.initComponents();
},
/**
* 组件初始化
*/
initComponents: function () {
// 初始化 表格
self.jGrid = $("#searchGrid").DataTable({
ajax: {
url: self.api.ajax_list,
// 请求到的数据
dataSrc: function (data) {
// 请求到数据时 重置 索引号
self.const.gridIndex = 0;
$.extend(data, {
iTotalDisplayRecords: data.count,
iTotalRecords: data.count,
});
return data.rows;
},
dataType: 'json',
crossDomain: true,
// 延迟加载
deferRender: true,
// 提交参数
data: function (param) {
if (self.jGrid) {
param.pageSize = self.jGrid.page.len(); // 取得每页显示记录数返回给服务器
}
// 根据起始记录索引 重新计算页码
if(param.start){
param.pageNo = Math.ceil(param.start / (param.pageSize * 1.0)) + 1;
}else{
param.start = 1;
}
return param;
}
},
serverSide: true,
bServerSide :true,
ordering: false,
info: true,
lengthChange: true,
searching: false,
scrollCollapse: true,
pageLength: 30,
bAutoWidth: true,
stateSave :false,
// 自定义每页记录数 下拉菜单
lengthMenu: [
[10, 20, 30, 50, 100],
['10', '20', '30', '50', '100']
],
oLanguage: {
"sProcessing": "数据加载中……",
"sSearch": "快速检索:",
"sLengthMenu": "每页显示 _MENU_ 条",
"sInfo": "从 _START_ 到 _END_ 条，总共 _TOTAL_ 条记录",
"sZeroRecords": "没有记录",
"sInfoEmpty": "暂无记录",
"sInfoFiltered": "(一共有 _MAX_ 条记录)",
"oPaginate": {
"sFirst": "首页",
"sPrevious": " 上一页 ",
"sNext": " 下一页 ",
"sLast": " 末页 "
}
},
columns: [
{
data: null,
defaultContent: '',
render: function (data, type, row) {
return ++self.const.gridIndex;
}
},
{
data: 'a',
defaultContent: ''
},
{
data: 'b',
defaultContent: ''
},
{
data: 'c',
defaultContent: ''
},
{
data: 'd',
defaultContent: ''
},
{
data: 'e',
render: function (data, type, row) {
var display = [
row.a
, ' / '
, row.b
, ' / <br/>'
, row.c
].join('');
return display;
},
},
]
});
}
});
self.init();
}.call();
})();