Super Lightweight jQuery Table Sort Plugin - sortColumn
File Size: | 5.23 KB |
---|---|
Views Total: | 1544 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

sortColumn is a tiny yet useful jQuery plugin which allows you to sort a particular column in a table by clicking on the column header.
Data format supported:
- String
- Number
- Currency
- Date (dd/mm/yyyy)
How to use it:
1. Import jQuery library and the jQuery sortColumn plugin at the end of the web page.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src='jQuery_sortColumn.js'></script>
2. Create a data table.
<table id="table-demo"> <thead> <tr> <th id="column-header">Name</th> </tr> </thead> <tbody> <tr> <td>Adam</td> </tr> <tr> <td>Jonh</td> </tr> <tr> <td>Peter</td> </tr> <tr> <td>Sam</td> </tr> <tr> <td>Zack</td> </tr> </tbody> </table>
3. Enable the plugin with options.
var sortOrder1='asc'; jQuery('#column-header').click(function(){ if (sortOrder1=='asc'){ jQuery("#table-demo").sortColumn({ index: 1, // index is 1 based instead of 0 based because of css nth:child(index) order: 'desc', // asc or desc format: 'string' // string, number, currency or date format }); sortOrder1='desc'; } else { jQuery("#table-demo").sortColumn({ index: 1, order: 'asc', format: 'string' }); sortOrder1='asc'; } });
This awesome jQuery plugin is developed by bighoho123. For more Advanced Usages, please check the demo page or visit the official website.