Skip to content
This repository has been archived by the owner. It is now read-only.
UNSUPPORTED: Bootstrap themed per-column filter for an HTML table
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
lib
src
test
.gitignore
.travis.yml
CHANGELOG.md
Gruntfile.js
MIT-LICENSE
README.md
bower.json
filterable.jquery.json
package.json

README.md

Filterable - UNSUPPORTED

Build Status

UNSUPPORTED

I no longer support this project, it is very out of date and will be even more out of date when Bootstrap 4 is out of beta. If someone wants to update the project - please submit pull request and I'll merged them.

Bootstrap and X-editable themed jQuery plugin that preforms per-column filtering for an HTML table.

Demo

http://lightswitch05.github.io/filterable

Usage

  • Filterable requires both Bootstrap and X-editable. To be able to change the color of the bootstrap icons, use the Font Awesome Icons inplace of the default ones.

       <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
       <link href="http://netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css" rel="stylesheet">
       <link href="http://cdnjs.cloudflare.com/ajax/libs/x-editable/1.4.5/bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet">
       <script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
       <script src="http://cdnjs.cloudflare.com/ajax/libs/x-editable/1.4.5/bootstrap-editable/js/bootstrap-editable.min.js"></script>
  • To use Filterable, just select the table that you want to use and call filterable on it.

    • $('#exampleTable').filterable();
  • To override any default options, just pass a hash of options to Filterable. This example makes filterable case-sensitive.

    • $('#exampleTable').filterable({ignoreCase: false});

Options

  • ignoreColumns
    • Column indexes to not make filterable
    • Type: Array
    • Default: []
  • onlyColumns
    • Column indexes to make filterable, all other columns are left non-filterable.
    • Type: Array
    • This takes presidence over ignoreColumns when provided.
    • Default: null - all columns
  • ignoreCase
    • If case should be ignored
    • Type: Boolean
    • Default: true
  • isMatch($cell, query)
    • Custom function to determine if the cell matches the user supplied filter
    • Type: Function
    • Default: null
  • editableOptions
    • Any custom options for X-editable
    • Type: Object
    • Defaults: {}
  • editableSelector
    • Selector to use on each heading to define the x-editable object. If not supplied, the enire heading is used.
    • Type: String
    • Defaults: null
  • beforeFilter
    • Function to call before filtering a column
    • Type: Function
    • Defaults: null
  • afterFilter
    • Function to call after filtering a column
    • Type: Function
    • Defaults: null
You can’t perform that action at this time.