Tablesorter demo

All options included, as well as the uitheme widget

by Mottie

HTML

<script src="http://mottie.github.com/tablesorter/js/jquery.tablesorter.js"></script>
<link rel="stylesheet" href="http://mottie.github.com/tablesorter/css/blue/style.css">
<select>
    <option value="-">Choose a column</option>
    <option value="0">Alphabetic</option>
    <option value="1">Numeric</option>
    <option value="2">Animals</option>
    <option value="3">Sites</option>
</select>

<table class="tablesorter">
     <thead>
         <tr>
             <th>Alphabetic</th>
             <th>Numeric</th>
             <th>Animals</th>
             <th>Sites</th>
         </tr>
     </thead>
     <tbody>
         <tr><td>abc</td><td>10</td><td>Koala</td><td>http://www.google.com</td></tr>
         <tr><td>abc</td><td>234</td><td>Ox</td><td>http://www.yahoo.com</td></tr>
         <tr><td>abc</td><td>10</td><td>Girafee</td><td>http://www.facebook.com</td></tr>
         <tr><td>zyx</td><td>767</td><td>Bison</td><td>http://www.whitehouse.gov/</td></tr>
         <tr><td>abc</td><td>3</td><td>Chimp</td><td>http://www.ucla.edu/</td></tr>
         <tr><td>abc</td><td>56</td><td>Elephant</td><td>http://www.wikipedia.org/</td></tr>
         <tr><td>abcd</td><td>155</td><td>Lion</td><td>http://www.nytimes.com/</td></tr>
         <tr><td>ABCD</td><td>87</td><td>Zebra</td><td>http://www.google.com</td></tr>
         <tr><td>zyx</td><td>999</td><td>Koala</td><td>http://www.mit.edu/</td></tr>
         <tr><td>zyxa</td><td>0</td><td>Llama</td><td>http://www.nasa.gov/</td></tr>
     </tbody>
 </table>

JavaScript

$('table').tablesorter();

$('select').change(function(){
    var column = parseInt($(this).val(), 10),
        direction = 1, // 0 = descending, 1 = ascending
        sort = [[ column, direction ]];
    if (column >= 0) {
        $('table').trigger("sorton", [sort]);
    }
});