Detailed explanation of using tablesorter plug-in (with case)

This time I will bring you a detailed explanation of the use of the tablesorter plug-in (with cases). What are theprecautionswhen using the tablesorter plug-in? The following is a practical case, let's take a look.

1. Import the file

The effect is as shown in the figure:

2. The standardHTML formmust include thead and tbody tags

 ...略 
 
 
 
Name
 
Sex
 
Address
 
 
 
 
 
zhangsan
 
boy
 
beijing
 
 
 
lisi
 
girl
 
shanghai
 
 
 
 

3. Set table to be sortable

$( document ).ready(function(){ //第一列不进行排序(索引从0开始) $.tablesorter.defaults.headers = {0: {sorter: false}}; $(".tablesorter").tablesorter(); });

Official document: http://tablesorter.com/docs/
Supplementary instructions:
A problem encountered during use, My table data is obtained through ajax. There is no problem when sorting the home page.
When sorting the next page, the data on the previous page will be re-displayed. To solve this problem, you can solve this problem after you obtain the data through ajax.
To trigger the "update" event, the code is as follows:

$(".tablesorter").trigger("update");

The above problem has really caused me a headache for a long time. I just started using the Pager plugin on the official website and found that this is not suitable.
I checked the information online and sorted out the following codes:

$(".tablesorter tbody tr").addClass("delete"); $(".tablesorter tbody tr.delete").remove(); $("table tbody").append(html); $(".tablesorter").trigger("appendCache"); $(".tablesorter").trigger("update"); $(".tablesorter").trigger("sorton",[[[2,1],[0,0]]]);

So I used them all. After long testing, I found that only $(".tablesorter").trigger("update"); can solve the problem
I don’t know what the others are.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

jQuery cross-domain iframe interface call (with code)

jQuery obtains the IFrame and its parent window object and use

The above is the detailed content of Detailed explanation of using tablesorter plug-in (with case). For more information, please follow other related articles on the PHP Chinese website!