jQuery Plugin For Fast In-page Filtering - filter_plugin.js
| File Size: | 6.74 KB | 
|---|---|
| Views Total: | 566 | 
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website | 
| License: | MIT | 
Yet another jQuery in-page filtering plugin which allows to hide the unmatched elements as the user types in an associated input field.
How to use it:
1. Place jQuery library and the jQuery filter_plugin.js plugin at the end of the document so the page loads faster.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery_filter_plugin.js"></script>
2. Create a live search field and specify which & where to filter through using the following data attributes:
<input type="text" class="jquery_filter" placeholder="Search" 
       data-search-items-wrapper-id="#item-wrapper" 
       data-search-item-class=".item-class" 
       data-search-classes=".items-to-search">
3. The item list you want to filter through should be like this:
<div id="item-wrapper">
  
  <div class="item-class">
    <h3 class="items-to-search">Title 1</h3>
  </div>
  
  <div class="item-class">
    <h3 class="items-to-search">Title 2</h3>
  </div>
  <div class="item-class">
    <h3 class="items-to-search">Title 3</h3>
  </div>
  ...
  
</div>
This awesome jQuery plugin is developed by prajjwal1988. For more Advanced Usages, please check the demo page or visit the official website.











