Introduction

tablesorter is a jQuery PlugIn for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. tablesorter can successfully parse and sort many types of data including linked data in a cell.

First Name Last Name Age Total Discount Difference Date English
PeterParker28$9.9920.9%+12.1Jul 6, 2006 8:14 AM 01-Dec-1940
JohnHood33$19.9925%+12Dec 10, 2002 5:14 AM 01-Dec-1941
ClarkKent18$15.8944%-26Jan 12, 2003 11:14 AM 01-Jan-1940
JamesBond46€153.1944.7%+77Jan 18, 2001 9:12 AM 01-Feb-1940
BruceEvans22$13.1911%-100.9Jan 18, 2007 9:12 AM 01-Mar-1940
BrianEvans22¥13.1911%0Jan 18, 2007 9:12 AM 31-Jul-1940
PaulParker28$9.9920.9%+12.1Jul 6, 2006 8:14 AM 01-Aug-1940
JackHood33$19.9925%+12Dec 10, 2002 5:14 AM 01-Dec-1940
ClarkKent18$15.8944%-26Jan 12, 2003 11:14 AM 28-Apr-1940
JamesBond45$153.1944.7%+77Jan 18, 2001 9:12 AM 01-Dec-1940
BruceEvans22$13.1911%-100.9Jan 18, 2007 9:12 AM 01-Dec-1940
BruceSmith65$13.1911%0Jan 18, 2007 9:12 AM 02-Aug-1940
DarrenWebb56£19.9925%+12Dec 20, 1960 5:14 AM 20-Sep-1942
BrianWebb84£15.8944%-26May 28, 1933 11:14 AM 20-Sep-1941
AlbertEinstein45$5.01562564.1%-20Dec 18, 2001 9:12 AM01-Dec-1961
AlbertEinstein30$6.01562564.1%-25Feb 29, 2000 9:15 AM01-Dec-1960

TIP! Sort multiple columns simultaneously by holding down the shift key and clicking a second, third or even fourth column header!

Simple Load of tablesorter on the named table id:

$(document).ready( function()
	{
		$("#myTable").tablesorter();
	}
);

Initial Sort Load of tablesorter

Syntax: [column,sortdirection],[column = 0 ... n, direction = ascend 0|descend 1], [2,0], [3,0], [4,1], [5,1]
This tells tablesorter to sort on the first [0, 0|1] and second column [1] in ascending [0] order.

$(document).ready(function()
	{
		$("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} );
	}
);	

/* For DateTime columns you can specify your format, like this:
   The available ones (currently) are: us, pt and uk. (for pt you can use 'dd/MM/yyyy hh:mm:ss') */

$(document).ready(function() 
    { 
        $("#myTable").tablesorter( {dateFormat: 'pt'} ); 
    } 
); 
    
/* Actual */
$( function() {
    $("#tablesorter-demo").tablesorter({
        sortList: [[0, 0], [2, 1]]      /* column 0 ascending 0 and column 2 descending 1 */
    });
});
/* Actual */

Click on the headers and you'll see that your table is now sortable!
You can also pass in configuration options when you initialize the table.