jquery数据表过滤分页

Posted

技术标签:

【中文标题】jquery数据表过滤分页【英文标题】:jquery datatables filtered pagination 【发布时间】:2014-06-27 14:46:03 【问题描述】:

将 iTotalRecords 和 iTotalDisplayRecords 与过滤一起使用似乎不适用于分页和表格显示长度

这是我的数据表 js 代码:

transTable.dataTable(
    "aaSorting": [[0,"desc"]],
    "sPaginationType": "full_numbers",
    "bJQueryUI": true,
    "aLengthMenu": [[10, 25, 50, 100, 200, -1], [10, 25, 50, 100, 200, "All"]],
    "iDisplayLength": 10,
    "bProcessing": true,
    "bServerSide": true,
    "sAjaxSource": "",
    "sServerMethod": "POST"
    "aoColumns": [
         "mData": "datetime",
         "mData": "trans",
         "mData": "type"
    ]
);

当我第一次加载 JSON(只是 POST 到同一页面)时,分页可以正常工作并像排序一样正确显示。我的默认每页显示是 10。

但是,当我使用搜索框进行过滤时,相关的 POST 参数是:

  ...
  iDisplayStart: 0
  iDisplayLength: 10
  sSearch: searchText
  ...

SQL 查询运行是:

SELECT 
* 
FROM 
trans 
WHERE 
  (type LIKE "%searchText%") OR 
  (trans_id LIKE "%searchText%") OR 
  (datetime LIKE "%searchText%") 
ORDER BY "datetime" DESC
LIMIT 10 -- 0 is iDisplayStart so no OFFEST set here and 10 is iDisplayLength

我的 json 响应是这样的:


  'aaData': [the query result rows],
  'iTotalRecords: 10000, //total number of records in the table
  'iTotalDisplayRecords: 10,
  'sEcho': //POST params "sEcho" value

因为查询中有 LIMIT 10,所以 iTotalDisplayRecords 将为 10。

您可能会认为分页会显示“显示 1,234 条记录中的 1 到 10 条记录(从 10,000 条中过滤)并允许对 1,234 条记录(123 页)进行分页。但不是。它说:“显示 1 到 10 条记录,共 10,000 条记录”没有分页。

如果我去掉 iDisplayLength,分页文本看起来正确并且分页工作正常,但是表格显示所有 1,234 条记录,而不仅仅是 10 条。

我做错了什么?

【问题讨论】:

【参考方案1】:

IIRC,iTotalDisplayRecords 应该是属于过滤集的记录数 (1,234)。

我通过在我的 sql 中使用输出参数来设置我的分页数据表来计算我的数据库中的记录总数 (10,000) 和过滤结果的数量 (1,234) 然后将其传递到我的 json 中(连同数据和抽奖次数)分别为 iTotalRecords 和 iTotalDisplayRecords。

Screenshot of implementation

【讨论】:

以上是关于jquery数据表过滤分页的主要内容,如果未能解决你的问题,请参考以下文章

使用 jquery 数据表进行服务器端处理,包括分页、过滤和搜索

如何在 JQuery 数据表中重置分页

jQuery Datatable:分页和过滤器无法正确显示

使用 laravel 和 jquery 分页无法按预期工作

过滤 JQuery 数据表后检索行数据

如何从 Datatables jQuery 插件中提取过滤后的数据?