This time I will share jQuery Plugin and tutorial about jQuery Plugin To Toggle HTML Table Columns – columnFilter, hope it will help you in programming stack.
columnFilter is a super tiny jQuery plugin for automatically generating checkbox based filter controls to toggle the visibility of your html table columns. Also has the ability to store and retrieve the current table state to the client side using HTML5 local storage.
How to use it:
1. Download and place the jQuery columnFilter plugin’s script jquery.columnfilter-0.0.1.js after jQuery library.
1 |
<script src="//code.jquery.com/jquery.min.js"></script> |
2 |
<script src="jquery.columnfilter-0.0.1.js"></script> |
2. Create a container element for the column filter controls.
1 |
<div class="column-list"></div> |
3. Call the plugin on your html table which has large number of columns.
1 |
$('table').columnFilter(); |
4. Default plugin settings.
1 |
$('table').columnFilter({ |
2 |
columnCheckboxsContainer: '.column-list', |
3 |
localStorageNamespace: 'table.column.', |
This awesome jQuery plugin is developed by herdiansc. For more Advanced Usages, please check the demo page or visit the official website.
