jQuery Text Live Search & Filter Plugin - HideSeek

jQuery Text Live Search & Filter Plugin - HideSeek
File Size: 90.3 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

HideSeek is a jQuery plugin for live search that allows you to search & filter text (or title/alt attribute) from a data list using an input field. It is customizable and compatible with IE7+, Chrome, Firefox, Safari and jQuery 1.8.1, 1.9.1, 1.10.1, 2.0.2. and supports highlighting, cutom events, custom message and initialization via data attribute.

See also:

How to use it:

1. Create an input field on your web page. Using data-list attribute to specify a data list.

<input id="search" name="search" placeholder="live search" type="text" data-list=".data-list">

2. Create a seachable & filterable data list using Html unordered list.

<ul class="data-list">
<li>C</li>
<li>Java</li>
<li>PHP</li>
<li>JavaScript</li>
<li>C++</li>
<li>Python</li>
<li>Shell</li>
<li>Ruby</li>
<li>Objective C</li>
<li>C#</li>
</ul>

3. Include required JQuery library and jQuery HideSeek plugin on the web page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="javascripts/vendor/jquery.hideseek.js"></script>

4. Initialize the plugin.

$(document).ready(function() {
$('#search').hideseek({
highlight: true // highlight the keyword.
});
});

5. Options and defaults.

// The list that holds the data
list:           '.hideseek-data',

// The text that appears when no results are available
nodata:         '',

// Where to search
// text, alt or title
attribute:      'text',

// Highlight the matched portion of text (wraps with tag)
highlight:      false,

// ignore data
ignore:         '',

// custom headers
headers:        '',

// Enables the selection by using the key arrows (up - down)
navigation:     false,

// ignore accents
ignore_accents: false,

// hidden mode
hidden_mode:    false

Change logs:

v0.8 (2017-05-16)

v0.7.1 (2016-03-17)

  • update

v0.7.0 (2016-01-07)

  • update

v0.6.2 (2015-05-14)

  • Fix minor issue with options

v0.6.1 (2015-05-12)

  • Add hidden_mode option

v0.6.0 (2015-03-29)

  • update.

v0.5.5 (2015-03-03)

  • Add option to ignore accents

v0.5.4 (2014-06-05)

  • update

v0.5.3 (2014-04-09)

  • update

v0.5.2 (2014-02-06)

  • update

v0.4.0 (2013-11-15)

  • Added custom events support

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