JFilter is a simple and powerful JQuery plugin that adds search, sort, filters, and flexibility to regular plain HTML lists, tables, or whatever.

table sorting and filtering with jquery demo, jquery plugin for sorting and filtering, jquery grid with filter and sorting example, jquery advanced search filter, jquery filter plugin jfilter

Multiple Select Dropdowns With Filter jQuery Plugin

How to make use of it:

1. Load the JFilter.js script after the jQuery JavaScript library.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="js/jfilter.js"></script

2. Add a “Searchable” class in a container to filter all child items.

<ul id="demo" class="searchable" >
  <li>Cras justo odio</li>
  <li>Dapibus ac facilisis in</li>
  <li>Morbi leo risus</li>
  <li>Porta ac consectetur ac</li>
  <li>Vestibulum at eros</li>
</ul>

3. Calling the add-on will automatically append a direct search input to the parent container.

$('#demo').jfilter();

4. Default settings.

$('#demo').jfilter({

// change input group addon
addon       : 'Search',

// change the placeholder input
placeholder : 'Search here...',

// change class searchable
class       : 'searchable',

// custom the search input
template    : '<div class="input-group filter"><span class="input-group-addon">Search</span><input type="text" class="form-control" placeholder="Search here..." ></div>'

});

Flexible Generic Filtering & Sorting Plugin, JFilter Github

See Demo And Download

Official Website(emalherbi-zz): Click Here

This superior jQuery/javascript plugin is developed by emalherbi-zz. For extra Advanced Usages, please go to the official website.