jquery datatable翻页功能无法实现

sj005 2016-02-09 10:07:00
配置如下

jQuery('#dyntable').dataTable({
"sPaginationType": "full_numbers",
"processing": true,
"serverSide": true,
"ajax": "../../../datatest.php",
"oLanguage": {
"sUrl": "cn.txt"
},
"aoColumns": [
{ "data": "index" },

.........

]
});
服务器端返回的数据为{"draw":"0","recordsTotal":"16","recordsFiltered":"16","data".........}

执行完后只能显示第一页,每页显示20个数据时也能显示16个,但是当每页显示10个数据时按道理应该分两页显示但是就是不分页,这是为什么?
...全文
1044 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
  • 打赏
  • 举报
回复
//定义每页显示数据数量 "aLengthMenu": [[5, 10, 15, -1], [5, 10, 15, "显示所有"]], [5,10,15,-1],[5, 10, 15, "显示所有"]要对应一致,不然没有效果
javaliu1 2016-02-16
  • 打赏
  • 举报
回复
举个栗子 function initList() { $("#datatable").dataTable({ "pagingType": "simple_numbers",//设置分页控件的模式 "searching": false,//屏蔽datatales的查询框 "aLengthMenu":[10],//设置一页展示10条记录 "bLengthChange": true,//屏蔽tables的一页展示多少条记录的下拉列表 "sAjaxSource": "project_projectManage", // post请求方法 "sServerMethod": "POST", "destroy":true, "ordering" :false, //禁用排序 "serverSide": true,//打开后台分页 "fnServerParams": function (aoData) { aoData.push( { "name": "scode_pro", "value": $('#scode_pro').val() }, { "name": "sname_pro", "value": $('#sname_pro').val() }, { "name": "sname_usr", "value": $('#sadviser_pro').val()}, { "name": "nstatus_pro", "value": $('#nstatus_pro option:selected').val() }); }, "aLengthMenu": [[20,50, 100], [20,50,100]], "aoColumns": [ {"data": "scode_pro","sClass":"table_left"}, {"data": "sname_pro","sClass":"table_left"}, {"data": "sname_usr","sClass":"table_left"}, {"data": "proState"} ], "columnDefs": [ {"targets": [4], "data": "sname_pro", "render": function(data, type, full) { if(full.proState == '进行中'){ return "<td class='content-line-td' width='15%'><a href=\"#\" style='width: 50px;' onclick=\"modify('"+full.nid_pro+"');\">修改</a> "+ "<a href=\"#\" style='height: 16px; line-height: initial;' onclick=\"del('"+full.nid_pro+"','"+full.sname_pro+"');\"> 删除</a> "+ "<a href=\"#\" style='height: 16px; line-height: initial;' onclick=\"endProject('"+full.nid_pro+"','"+full.sname_pro+"');\"> 结束</a> "+ "</td>"; }else{ return "<td class='content-line-td' width='15%'><a href=\"#\" style='width: 50px;' onclick=\"startProject('"+full.nid_pro+"','"+full.sname_pro+"');\">再开始</a> "+ "</td>"; } },"sClass":"table_left" }, ], "oLanguage":{ "sLengthMenu": "每页显示 _MENU_ 条记录", "sZeroRecords": "没有检索到数据", "sInfo": "显示 _START_-_END_ 条数据,共有 _TOTAL_ 条记录。", "sInfoEmtpy": "没有数据", "sProcessing": "正在加载数据...", "oPaginate": { "sFirst": "首页", "sPrevious": "上一页", "sNext": "下一页", "sLast": "尾页" } }, "fnServerData": function (sUrl, aoData, fnCallback) { $.ajax({ "url": sUrl, "data" :aoData, "success": fnCallback, "dataType": "json", "cache": false, "success" : function(resp) { fnCallback(resp); $("#datatable td").each(function(i){ //给td设置title属性,并且设置td的完整值.给title属性. $(this).attr("title",$(this).text()); }); } }); } }); }; ------------------------------------------- aoData.push 里面是检索的参数 aoColumns页面显示的数据 后台接收的分页参数如下 sEcho = Integer.valueOf(request.getParameter("sEcho")); iDisplayLength = Integer.valueOf(request.getParameter("iDisplayLength")); iDisplayStart = Integer.valueOf(request.getParameter("iDisplayStart")); sql += " ORDER BY `nid_sup` limit "+iDisplayStart+","+iDisplayLength+" "; 翻页 ------------------------------------------------ 返回的json格式如下 arraySize -->检索出来的数据。arraySize 数据大小 public static StringBuffer JsonUtils(List<?> objcet, int arraySize,String jsonArray,int sEcho){ StringBuffer json = new StringBuffer(); json.append("{"); json.append("\"sEcho\"" + ":" + sEcho + ""); json.append(","); json.append("\"iTotalRecords\"" + ":" + arraySize + ""); json.append(","); json.append("\"iTotalDisplayRecords\"" + ":" + arraySize + ""); json.append(","); json.append("\"aaData\":"); json.append("["); if (objcet != null && objcet.size() > 0) { for (Object obj : objcet) { JSONArray object = JSONArray.fromObject(obj); String replactobj = object.toString().replaceAll("^.*\\[", "") .replaceAll("].*", ""); json.append(replactobj); json.append(","); } } else { json.append("}"); } json.setCharAt(json.length() - 1, ']'); json.append("}"); return json; } ---------------------- 觉得有用给分哦。。。
  • 打赏
  • 举报
回复
http://bbs.csdn.net/topics/391901794
sj005 2016-02-09
  • 打赏
  • 举报
回复
返回的数据是json 服务器端返回数据的代码 echo json_encode( SSP::simple($_GET, $table, $primaryKey, $columns ) );
枯心人 2016-02-09
  • 打赏
  • 举报
回复
返回的数据,不是json

87,992

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧