Tiny jQuery Plugin For Clint-side Table Filtering - filterForTable
File Size: | 14.7 KB |
---|---|
Views Total: | 5186 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

filterForTable is a lightweight jQuery plugin to provide basic filtering & live searching functionality for html table that works with formatted numbers, data-filter attribute, and excepted rows.
More examples:
Basic usage:
1. First you need to include the filterForTable plugin's script after jQuery JavaScript library like this:
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="filterForTable.js"></script>
2. Create a normal search field to filter your html table.
<input id="searchInput" name="search" placeholder="Searching..."/>
3. Active the filtering functionality on your html table.
$('table').filterForTable();
4. By default, the plugin allows you to filter table rows by cell values. You can also use data-filter
attribute instead.
// added data-filter for these tds <td data-filter="Carlitos Bacca">Carlos Bacca</td> <td data-filter="Alex Rodrigo Dias da Costa">Alex</td> <td data-filter="Super Mario">Mario Balotelli</td> <td data-filter="Jack Giacomo Bonaventura">Giacomo Bonaventura</td>
5. All plugin options.
// JS Selector for search field searchSelector: '#searchInput', // minimaum characters minChars: 1, // maximum characters minRows: 1, // message to display when there'os no data found emptyMsg: 'No data found', // CSS ID for no empty message <tr> tag emptyTrId: 'filterForTableEmptyRow', // <tr> with choosen class will be excepted from filtering exceptClass: ''
This awesome jQuery plugin is developed by AlexYaroma. For more Advanced Usages, please check the demo page or visit the official website.