显示按字母顺序排列的搜索结果时如何修改行数

Question

我正在使用 DataTables to create a table that is able to dynamically filter context. I am following the basic example, here。

但是，我想进行一项自定义：在我的 table 中显示按字母顺序排列的结果，每个字母都有一个 "title row"。例如：

A
- Apple
- Avocado
B
- Bear
- Button
C
- Car

我已成功完成此操作（在服务器端使用 Django 模板进行输出），但默认显示的页脚标签 Datatables 现在不正确，因为它计算标题行。在上面的示例中，它显示为：

Showing 1 to 8 of 8 entries

什么时候应该读作：

Showing 1 to 5 of 5 entries.

进一步挖掘，信息结果通过 API 作为 "language": {"info": "Showing START to END of TOTAL entries",} 访问。

我能够从我的 Django 模板中计算 header 行并将其保存为变量（例如 var headercount = 3）。

如何修改 DataTables API 中的 START、END 和 TOTAL，以便它们在循环浏览时在每一页上都是准确的？

Answer 1

解决方案 #1

您可以使用 infoCallback 选项定义一个函数，当 table 信息即将显示时将被调用。

例如，可以使用以下代码实现默认行为。

var table = $('#example').DataTable({
   "infoCallback": function(settings, start, end, max, total, pre){
      return "Showing " + start + " to " + end + " of " + total + " entries"
         + ((total !== max) ? " (filtered from " + max + " total entries)" : "");
   }        
});

您需要相应地调整数字以避免计算标题。

有关代码和演示，请参阅 this jsFiddle。

解决方案#2

替代解决方案是使用 JavaScript 而不是静态 HTML 来按字母顺序排列 table 内容，类似于 Row grouping example.

然后信息面板将自动包含正确的数字，因为 header 行是作为附加节点动态添加的，这些节点未被 DataTables 计为行。

有关代码和演示，请参阅 this jsFiddle。

解决方案 #3

使用 AlphabetSearch plugin 添加对字母搜索的支持。

显示按字母顺序排列的搜索结果时如何修改行数

How to modify row counts when displaying alphabetized search results

django

jquery

datatables

datatables-1.10

解决方案 #1

解决方案#2

解决方案 #3