Bootstrap Plugin To Filter DOM Elements with User Input - Quick search

File Size: 2.68 MB
Views Total: 3518
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Bootstrap Plugin To Filter DOM Elements with User Input - Quick search

Quick search is a simple, lightweight jQuery plugin built for Bootstrap framework that enables you to search through large tables, lists and any data sets with user input.

How to use it:

1. Add the jQuery quick search plugin into your Bootstrap project.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="/path/bootstrap-quick-search.js"></script>

2. Create a regular input field with the data-input="quick-search" attribute to initialize the quick search plugin automatically. The data-search-target is used to specify the target elements to search through.

<input class="form-control" 
       name="quick-search"
       placeholder="search for keyword..."
       data-input="quick-search" 
       data-search-target="#searchable tbody > tr"   
       data-noresult-text="No result(s)."
>

3. You can also initialize the plugin by calling the quickSearch() method on target input field.

$('input').quickSearch()

4. Default configuration options.

$('input').quickSearch({
  clearSelector: '.form-action-clear',
  activeClass: 'has-feedback'
})

Change log:

v0.9.0 (2016-02-03)


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