Ta b l e s o r te r
The Tablesorter plugin is a popular third-party jQuery plugin available from http:
//www.tablesorter.com. The plugin does what the name implies; the plugin is attached to any
<table> element that you like, and then it can sort that table’s columns, one or more at a time.
For example, you can sort by name only, by name and then by age, or by name, age, and then
by date. How many columns are sorted is entirely up to you.The $.tablesorter() plugin allows for some confi guration and customization; whatever isn’t
covered in this chapter explicitly is documented both on the Tablesorter website at
http://www.tablesorter.com as well as in Appendix T, “Tablesorter.”Sorting a Table
The $.tablesorter() plugin is straightforward. It functions well out-of-the-box and dropped
in a document; with only a call to the plugin’s method and some styling, you can be off sorting
tables in no time.The following example (Example 19-1 in the code downloads at http://www.wrox.com/go/webdevwith-
jquery) sets up the basic, out-of-the-box $.tablesorter() plugin:<!DOCTYPE HTML>
<html lang='en'>
<head>
<meta charset='utf-8' />
<title>Tablesorter</title>
<script src='../jQuery.js'></script>
<script src='../jQueryUI.js'></script>
<script src='../Tablesorter/Tablesorter.js'></script>
<script src='Example 19-1.js'></script>
<link href='Example 19-1.css' rel='stylesheet' />
</head>
<body>
<table>
<colgroup>
<col style="width: 100px;" />
<col />