This time I will share jQuery Plugin and tutorial about jQuery Plugin For Multi-column Table Sorting – tablesort.js, hope it will help you in programming stack.
Just another jQuery plugin for muitl-column table sorting that allows you to sort table cells using string comparison or custom sort functions.
How to use it:
1. Load the latest version of jQuery library and the jQuery tablesort.js script in the html page.
1 |
< script src = "//code.jquery.com/jquery-latest.min.js" ></ script > |
2 |
< script src = "jquery.tablesort.min.js" ></ script > |
2. Call the function on the target table element and done.
1 |
$( 'table' ).tablesort(); |
3. Custom the sort value using data-sort-value
attribute.
1 |
< td data-sort-value = "2" >October 7, 1968</ td > |
4. Disable the sort functionality on a specific column using no-sort
attribute.
1 |
< th class = "no-sort" >NO SORT</ th > |
5. Custom sort function.
02 |
$( 'thead th.date' ).data( 'sortBy' , function (th, td, tablesort) { |
03 |
return new Date(td.text()); |
07 |
$( 'thead th.hex' ).data( 'sortBy' , function (th, td, tablesort) { |
08 |
return parseInt(td.text(), 16); |
12 |
$( 'thead th.personID' ).data( 'sortBy' , function (th, td, tablesort) { |
13 |
return App.People.get(td.text()); |
Change log:
2016-10-02
2016-08-21
- v0.0.10: Support jQuery 2.2.x
This awesome jQuery plugin is developed by kylefox. For more Advanced Usages, please check the demo page or visit the official website.