Site icon 时鹏亮的Blog

jQuery表格插件DataTables-AJAX交互数据示例代码与经验

请知悉:本文最近一次更新为 9年 前,文中内容可能已经过时。

有时数据量太大,不走AJAX载入页面会卡,所以研究了下AJAX的方法和实现。

这玩意儿其实官方说明文档挺清楚的,后来发现国内还有中文版的,所以文末附上链接,有兴趣的自己研究下。
JS方面,dataTable方法里加入参数:

"processing": true,
"serverSide": true,
"ajax": {
"url": ajaxurl,
"dataType": "json",
"type": "POST"
}

因为是用POST方式传递的,GET方式传递URL参数太长不好看。

POSFT传递后台的PHP脚本大概是这样的:

<?php
$draw=intval($_POST['draw'])+1;#第几次数据交互
$length=intval($_POST['length']);#每页长度-用于limit第二个参数
$start=intval($_POST['start']);#起始位置-用于limit第一个参数
$output=array();
$output['draw']=$draw;
$output['recordsTotal']=$count;
$output['recordsFiltered']=$count;
$result=$database->select("sql query");#数据库取出来的数据
foreach($result as $k=>$v){
$tmp=array();
foreach($sql as $key=>$value){
$tmp[]=$result[$k][$value];
}
$output['data'][]=$tmp;
}
echo $_GET['callback']."(";
echo json_encode($output).");";
die();

剩下的自己领悟。

DataTables-AJAX数据交互文档:http://dt.thxopen.com/manual/server-side.html


如您从本文得到了有价值的信息或帮助,请考虑扫描文末二维码捐赠和鼓励。

尊重他人劳动成果。转载请务必附上原文链接,我将感激不尽。


与《jQuery表格插件DataTables-AJAX交互数据示例代码与经验》相关的博文:

Exit mobile version