jQuery Plugin For Interactive Search Filter - sieve

File Size: 30.3 KB
Views Total: 3142
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Interactive Search Filter - sieve

sieve is a useful and powerful jQuery Plugin that adds an interactive search filter to any block of content for quickly filtering out the content without any server-side script.

Basic Usage:

1. Markup HTML Structure.

<div class="demo">
<p> [CONTENT 1] </p>
<p> [CONTENT 2] </p>
...
<p> [CONTENT x] </p>
</div>

2. Include jQuery library and sieve.js

<script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="jquery.sieve.js" type="text/javascript"></script>

3. Initialize the plugin

<script>
    var searchTemplate = "<div class='row form-inline'><label style='float: right;'>Search: <input type='text' placeholder='(start typing)'></label></div>"
    $(".p-sieve").sieve({ searchTemplate: searchTemplate, itemSelector: "p" });
</script>

This awesome jQuery plugin is developed by rmm5t. For more Advanced Usages, please check the demo page or visit the official website.