jQuery Plugin For Fast In-page Filtering - filter_plugin.js
File Size: | 6.74 KB |
---|---|
Views Total: | 542 |
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.