jQuery - JavaScript Sorting

There are times, though, when we either don't want to wait for server responses when sorting, or don't have a server-side scripting language available to us. A viable alternative in this case is to perform the sorting entirely on the browser using JavaScript client-side scripting.

For example, suppose we have a table listing books, along with their authors, release dates, and prices:


<table style="WIDTH: 539px; HEIGHT: 253px" class="sortable">
    <thead>
        <tr>
            <th> </th>
            <th>Title</th>
            <th>Author(s)</th>
            <th>Publish Date</th>
            <th>Price</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>

             </td>
            <td>Building Websites with Joomla! 1.5 Beta 1</td>
            <td>Hagen Graf</td>
            <td>Feb 2007</td>
            <td>$40.49</td>
        </tr>
        <tr>
            <td> </td>
            <td>Learning Mambo: A Step-by-Step Tutorial to Building Your

            Website</td>
            <td>Douglas Paterson</td>
            <td>Dec 2006</td>
            <td>$40.49</td>
        </tr>
    </tbody>
</table>

We'd like to turn the table headers into buttons that sort by their respective columns. Let us look into ways of doing this.

Learning jQuery - JavaScript Sorting