How to modify row counts when displaying alphabetized search results

我是研究僧i 提交于 2019-12-21 07:55:03

问题


I am using DataTables to create a table that is able to dynamically filter context. I am following the basic example, here.

However, I want to make one customisation: To display alphabetised results in my table, with a "title row" for each alphabet letter. Eg:

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

I have done this successfully (using Django templating on the server side for the output), but the footer label Datatables shows by default is now incorrect, because it counts the title rows. In the above example it reads:

Showing 1 to 8 of 8 entries 

When it should read:

Showing 1 to 5 of 5 entries.

Digging further, the info result is accessed via the API as "language": {"info": "Showing START to END of TOTAL entries",}.

I have the ability to count and save the header rows as a variable (e.g. var headercount = 3) from my Django template.

How do I modify the START, END, and TOTAL in the DataTables API so that they are accurate on every page when cycled through?


回答1:


SOLUTION #1

You can use infoCallback option to define a function that will be called when table information is about to be displayed.

For example, default behavior can be achieved with the code below.

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

You need to adjust the numbers accordingly to avoid counting the headings.

See this jsFiddle for code and demonstration.

SOLUTION #2

Alternative solution would be to use JavaScript and not the static HTML to alphabetize table content, similarly to Row grouping example.

Then information panel would contain correct numbers automatically because header rows are added dynamically as additional nodes that are not counted by DataTables as rows.

See this jsFiddle for code and demonstration.

SOLUTION #3

Use AlphabetSearch plugin which adds support for alphabetical search.



来源:https://stackoverflow.com/questions/31938113/how-to-modify-row-counts-when-displaying-alphabetized-search-results

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!