jQuery tablesorter options and useful info

I’ve recently been using a lot of the jQuery tablesorter plugin across many tables containing many different types of data. It’s a great plugin, but occasionally its documentation can be a little lacking in parts.

One of the first useful things you might want is the list of inbuilt data types that it handles. Most of the time these will be auto detected, however sometimes you’ll need to specify them manually (either in your jQuery, or by adding some markup to your table header, i.e. <th class="{sorter: false}"> ).

Here’s the list of built in data types:

  • text
  • integer
  • currency
  • floating
  • ipAddress
  • url
  • isoDate
  • percent
  • usLongDate
  • shortDate (which has options of UK, US, and dd/mm/yyyy)
  • time

I found the list originally here: jQuery Tablesorter: List of Builtin Parsers/Sorters @ terminally-incoherent.com, which doesn’t mention the UK/US options, which could have been added to the plugin since the post was made. The shortDate variants can be used directly, i.e. class="{sorter: 'uk'}" in the table header tag.

Another thing to note if you’re trying to use the inline option syntax above (i.e. <th class="{sorter: false}"> ) to set sorting options is that you need to be using the jQuery metadata plugin. Now, this IS in the tablesorter documentation, but somehow I managed to miss it.

Finally, Norwegian dates are in dd.mm.yyyy format, which is a useful excuse to throw in a quick example of how to add a custom parser:

 
$.tablesorter.addParser({ 
                     id: 'dd.mm.yyyy', 
                      is: function(s) { 
                          return false; 
                      }, 
                      format: function(s) { 
                          s = '' + s; 
                          var hit = s.match(/(\d{1,2})\.(\d{1,2})\.(\d{4})/); 
                          if (hit && hit.length == 4) { 
                            return hit[3] + hit[2] + hit[1]; 
                          } 
                          else { 
                            return s; 
                          } 
                      }, 
                      type: 'text' 
                  });
 

The other one I needed was for comma separated numbers, so here’s what that one looks like:

 
$.tablesorter.addParser({ 
      id: "commaNum", 
      is: function (s) { 
          return false; 
      }, 
      format: function (s) { 
          return s.replace(/,/g, ''); 
      }, 
      type: 'numeric' 
  });

 

Happy sorting!

Tags: ,

DotNetKicks Image

 Print | Posted on Sunday, July 11, 2010 4:26 PM |



Feedback

Gravatar

# re: jQuery tablesorter options and useful info

is there something else that is needed? i toss this function in but it makes no difference?

Thanks

11/17/2010 10:53 AM | Matt

Gravatar

# re: jQuery tablesorter options and useful info

Hi Matt,

Once you've got the function in you also need to apply it to the column, i.e. by applying

th class="{sorter: commaNum}" or dd.mm.yyyy to the column depending on which one you're trying to use. Let me know if you need more info and I whack up a quick example somewhere.


Ross

11/18/2010 1:58 PM | Ross Hawkins


Post Comment

Title  
Name  
Email
Website / Url
 

Your comment

   
Ensure the word in this box says 'orange':
 
Please add 3 and 2 and type the answer here:





Due to excessive comment spam, all comments are now being moderated. If you're a comment spammer then you're wasting your time here. Your comments will not be published - ever.


About me

My name is Ross Hawkins and I'm a developer, consultant, business owner and writer based in Auckland, New Zealand (pictured below!). My current work revolves around ASP.NET, C#, jQuery, Ajax, SQL Server, and a mix of other Microsoft development technologies.

I also have about 15 years of experience with IBM Lotus Notes/Domino and associated technologies. While Notes/Domino is no longer my primary focus I still like to dabble and keep my skills up to date.

I own and run 2 businesses - Hawkins Consulting Services, and Ignition Development.

Bethells Beach, located in sunny West Auckland, New Zealand




Subscribe

Subscribe to this feed


Search




Popular Content

Troubleshooting WebResource.axd

The .NET 2.0 framework changed the way clientside JavaScript is delivered to the browser. Previously, ASP.NET 1.1 used the aspnet_client directory whereas now 2.0 uses WebResource.axd.

Published on October 8, 2006

Microsoft AJAX Extensions: Sys.Debug is null or not an object

One of the breaking changes which was made with the 1.0 release of the Microsoft Ajax Extensions was the renaming of the 'Debug' class to 'Sys.Debug' for reasons of compatiability with other frameworks. Breaking changes like this can often be a source of frustration..

Published on May 22, 2007

Simple ASP.NET Character Counter

A textbox character counter is a pretty simple piece of functionality, and there's a lot of different ways to apply one to your application. The following method is nice and simple, and can be done using only clientside JavaScript if required, or combined with server side code in order to create a more dynamic effect

Published on December 4, 2006

Simple ASP.NET Character Counter - with Master Page Support

A quick update to my previous character counter article adding some changes for those using it with Master Pages.

Published on February 7th, 2009

Adding Tooltips to Gridview Headers

As the title says, this is a very simple but dynamic way of achieving tooltip text on a header column. It's not overly flash, but it's lightweight and quick to implement.

Published on April 15, 2007

SQL Server Web Report Viewer Issues on Windows 2008 Server/IIS7

A fix for another AXD related issue, this time with the SQL Server Web Report Viewer Control which was being served up via IIS7 on a Windows 2008 server.

Published on June 2, 2007
Updated on April 10, 2008




Archives

January, 2012 (3)
December, 2011 (3)
November, 2011 (8)
October, 2011 (9)
September, 2011 (8)
August, 2011 (5)
July, 2011 (4)
June, 2011 (7)
May, 2011 (5)
April, 2011 (3)
March, 2011 (8)
February, 2011 (4)
January, 2011 (3)
December, 2010 (8)
November, 2010 (5)
October, 2010 (6)
September, 2010 (7)
August, 2010 (11)
July, 2010 (12)
June, 2010 (8)
May, 2010 (8)
April, 2010 (4)
March, 2010 (8)
February, 2010 (6)
January, 2010 (12)
December, 2009 (13)
November, 2009 (11)
October, 2009 (12)
September, 2009 (12)
August, 2009 (2)
July, 2009 (7)
June, 2009 (12)
May, 2009 (9)
April, 2009 (9)
March, 2009 (9)
February, 2009 (8)
January, 2009 (7)
December, 2008 (6)
November, 2008 (7)
October, 2008 (9)
September, 2008 (12)
August, 2008 (9)
July, 2008 (6)
June, 2008 (24)
May, 2008 (13)
April, 2008 (16)
March, 2008 (8)
February, 2008 (10)
January, 2008 (1)
December, 2007 (14)
November, 2007 (11)
October, 2007 (11)
September, 2007 (13)
August, 2007 (11)
July, 2007 (5)
June, 2007 (15)
May, 2007 (11)
April, 2007 (9)
March, 2007 (9)
February, 2007 (10)
January, 2007 (8)
December, 2006 (18)
November, 2006 (11)
October, 2006 (14)
September, 2006 (9)
August, 2006 (10)
July, 2006 (4)
June, 2006 (4)
May, 2006 (6)
April, 2006 (3)
February, 2006 (6)
January, 2006 (10)
September, 2005 (2)
August, 2005 (4)

Post Categories

ASP.NET
AJAX
Amusing
NZ
NZ Trains
Notes/Domino
Visual Studio
Web Development
Miscellaneous
Me
Rugby
C#
SQL