The plugins site is currently in development.
We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.
PicNet JQuery Table Filter
Overview
This plugin adds a row to the section of a table and adds filters that allows real time filtering of tabular data. Please see the home page for full details.
Demo
See the demo page for a live example of this page.
Getting Started
This plugin uses several other popular plugins so you will need to download these plugins before starting.
These plugins will then need to be referenced in the section of your page.
Filter Types
Currently the picnet.jquery.tablefilter.js only supports two kinds of filters. The first and default is 'text' which just produces a text box for context sensitive text matches. The second is 'ddl', this produces a drop down list that allows the selection of a single item in that list. To specify the filter type simply add "filter-type='ddl'" in the header cell of the required column.
Options
We can also pass an options object to control some basic behaviours of the tableFilter. The current supported options are.
- additionalFilterTriggers: These are additional input controls that will be hooked in to the filter code. Currently only type='text' and type='checkbox' controls are supported.
- clearFiltersControls: Controls that onclick will clear all of the filter values (including additionalFilterTriggers).
- matchingRow: function(state, tr, textTokens) { ... } These event will allow you to determine wether a matching row is actually correctly matching. This event will be called when a row is considered to have matched the filter, returning false will override this assumtion and hide the row from the results.
- matchingCell: function(state, td, textTokens) { ... } This event behaves the same as the one above but allows more granular overriding capabilities. Returning false will again override the default match logic.
