Alphanumeric Sorting Plugin For HTML Table - jQuery Table Sorter

A lightweight, customizable jQuery table sorter that enables the user to sort alphanumeric data in an HTML table by clicking the table headers.

How to use it:

1. Download and put the jQuery Table Sorter plugin's script after jQuery.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="dist/jquery-table-sorter.min.js"></script>

2. Just call the function on the HTML table and the plugin will do the rest. Note that your HTML table must have thead and th elements.

<table>
  <thead>
    <tr>
      <th>#</th>
      <th>First</th>
      <th>Last</th>
      <th>Handle</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Mark</td>
      <td>Otto</td>
      <td>@mdo</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jacob</td>
      <td>Thornton</td>
      <td>@fat</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Larry</td>
      <td>the Bird</td>
      <td>@twitter</td>
    </tr>
  </tbody>
</table>

$(function(){

  $( 'table' ).TableSorter();

});

3. Customize the Ascending/Descending sorting icons. Default: ▴ and ▾.

$( 'table' ).TableSorter({
  arrows: { 
    up : '▴', 
    down : '▾' 
  }
});

4. Apply an extra CSS class to the Ascending/Descending sorting icons.

$( 'table' ).TableSorter({
  icon_class : 'ts-sort-indicator'
});

5. Specify the columns to be sortable.

$( 'table' ).TableSorter({
  columns: 'th'
});

---

This awesome jQuery plugin is developed by vsilva472. For more Advanced Usages, please check the demo page or visit the official website.