jquery tablesorter

jQuery tablesorter custom sort

The jQuery tablesorter library is great. However, sometimes we have a column with no standard values to sort. In these cases, we can define a custom parser for telling tablesorter how to order datas.

Let’s say that the fourth column contains numbers with a point (.) as the thousand separator. Tablesorter will sort the column wrong. The best way to obtain a correct ordering is to tell tablesorter to remove the points from the number before ordering the values. So let’s see how to implement a custom parser.

jQuery Tablesorter with custom sort

 // add a new parser through the tablesorter addParser method 
 $.tablesorter.addParser({ 
   // set a unique id 
   id: 'thousands',
   is: function(s) { 
   // return false so this parser is not auto detected 
     return false; 
   }, 
   format: function(s) {
     // format your data for normalization 
     return s.replace(/\./g,'');
   }, 
   // set type, either numeric or text 
   type: 'numeric' 
}); 

Now that we created the parser, we can use it on our table:

 $("#ourTable").tablesorter({ 
   headers:
   { 
     3 : { sorter: "thousands" } // Use the new parser for the fourth column
   }
 })

So this is how to create a custom sorting function for jQuery tablesorter!

Tags: No tags

Leave A Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.