Skip to content
A jQuery plugin to filter a table based on multiple inputs
Branch: master
Clone or download
Latest commit 04e1865 Jul 14, 2015
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
LICENSE Initial commit Aug 24, 2013
README.md fixing some JS typos Jul 18, 2015
multifilter.jquery.json speedup for finding td in first row Apr 1, 2014
multifilter.js Remove an empty string that we don't need Jul 14, 2015
multifilter.min.js Fix for better performance on large tables Mar 31, 2014

README.md

multifilter

A jQuery plugin to filter a table based on multiple inputs. Check out the demo.

Usage

Call the plugin on any input you want to track and tell it what to look for with a data-col attribute:

$(document).ready(function() {
  $('.filter').multifilter();
});

If you have multiple tables on the same page and you want different sets of inputs for the different tables, you can pass a jQuery object for each instance for each table element.

$(document).ready(function() {
  $('.main-filter').multifilter({
    'target': $('#main-table')
  });

  $('.alt-filter').multifilter({
    'target': $('#alt-table')
  });
});

As long as the data-col attribute matches up with something in the <thead>, it will filter the content in those columns in the table:

<input class="filter" name="email" placeholder="email" data-col="email">

That's it!

Alternatively, if you prefer your tables without a <thead> you match up the column with a class on your <td> tags by doing:

$(document).ready(function() {
  $('.main-filter').multifilter({
    'method': 'class'
  });
});
You can’t perform that action at this time.