jQuery Plugin To Toggle HTML Table Columns - columnFilter

File Size: 6.83 KB
Views Total: 4691
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Toggle HTML Table Columns - columnFilter

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.

See also:

How to use it:

1. Download and place the jQuery columnFilter plugin's script jquery.columnfilter-0.0.1.js after jQuery library.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.columnfilter-0.0.1.js"></script>

2. Create a container element for the column filter controls.

<div class="column-list"></div>

3. Call the plugin on your html table which has large number of columns.

$('table').columnFilter();

4. Default plugin settings.

$('table').columnFilter({
  columnCheckboxsContainer: '.column-list',
  localStorageNamespace: 'table.column.',
  headerCell: 'TH'
});

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