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

我正在使用DataTables创建一个能够动态过滤上下文的表。 我在这里遵循基本的例子。

但是,我想进行一次自定义:在我的表中显示字母表结果,每个字母都有一个“标题行”。 例如:

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",}访问"language": {"info": "Showing START to END of TOTAL entries",}

我能够从我的Django模板中计算并将标题行保存为变量(例如var headercount = 3 )。

如何修改DataTables API中的STARTENDTOTAL ,以便在循环播放时在每个页面上都准确无误?

解决方案#1

您可以使用infoCallback选项定义将在显示表信息时调用的函数。

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

 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)" : ""); } }); 

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

有关代码和演示,请参阅此jsFiddle 。

解决方案#2

替代解决方案是使用JavaScript而不是静态HTML来对表格内容进行字母顺序排列,类似于行分组示例 。

然后信息面板将自动包含正确的数字,因为标题行是作为DataTables未计入行的其他节点动态添加的。

有关代码和演示,请参阅此jsFiddle 。

解决方案#3

使用AlphabetSearch插件 ,增加了对字母搜索的支持。