3 state jQuery Table Sorting Plugin tablesort3s - Download 3-state jQuery Table Sorting Plugin - tablesort3s

Download 3-state jQuery Table Sorting Plugin – tablesort3s

By Posted on

This time I will share jQuery Plugin and tutorial about 3-state jQuery Table Sorting Plugin – tablesort3s, hope it will help you in programming stack.

3 state jQuery Table Sorting Plugin tablesort3s - Download 3-state jQuery Table Sorting Plugin - tablesort3s
File Size: 16.7 KB
Views Total: 1738
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Demo Download

tablesort3s is a really small (~3kb) jQuery plugin that adds3-state sorting functionality (ascending, descending and unsorted) to existing html tables. Helps you sort a multi-column html table without page refreshes.

How to use it:

1. Load the jQuery tablesort3s plugin’s style sheet in the document’s head section.

view source
1 <link rel="stylesheet" href="css/tablesort3s.css">

2. Load the jQuery tablesort3s plugin’s JavaScript file after jQuery library but before the </body> tag.

view source
1 <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
2 <script src="js/jquery.tablesort3s.js"></script>

3. Bind 3-state sort controls to tables with static content and/or sort/unsort them.

view source
1 $('table').tablesort3s();

4. Available options with default values.

view source
01 // array of 4 strings
02 // The 2 first strings are also used for the text content of the controls (for accessibility).
03 hints : null
04  
05 // 0-based index of the header row to bind sort widget on
06 headerRow : 0.
07  
08 // Applied on <tr> elements to check fakes.
09 fakeFilter : null,
10  
11 // Applied on <th> elements to prevent widget binding individually.
12 noSortFilter : 'nosort',
13  
14 // Class of the sort widget container.
15 widgetClass : 'sort'
16  
17 // True to bind the sort widget even if the table has less than 2 rows.
18 forceUI : false.

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

source : jqueryscript.net

Related posts: