jQuery quickSearch

More information and download at Github

Examples

Simple example

Email Id Phone Total Ip Url Time ISO Date UK Date
devo@flexomat.com 66672 941-964-8535 $2482.79 172.78.200.124 http://gmail.com 15:10 1988/12/14 14/12/1988
henry@mountdev.net 35889 941-964-9543 $2776.09 119.232.182.142 http://www.gmail.com 3:54 1974/1/19 19/1/1974
christian@reno.gov 60021 941-964-5617 $2743.41 167.209.64.181 http://www.dotnet.ca 10:58 2000/3/25 25/3/2000
muffins@donuts.com 17927 941-964-9511 $2998.18 210.214.231.182 http://google.se 21:22 1993/1/24 24/1/1993
muffins@reno.gov 76375 941-964-2757 $1836.09 220.222.93.171 http://www.samba.org 15:22 1988/4/4 4/4/1988
mendez@gmail.com 45834 941-964-2575 $2805.46 228.170.245.253 http://flexomat.com 11:31 1975/12/12 12/12/1975
dev@gmail.com 20022 941-964-4967 $3296.54 175.248.70.240 http://www.flexomat.com 4:27 2002/7/3 3/7/2002
foo@polyester.se 55977 941-964-745 $2953.73 222.114.227.156 http://www.donuts.com 23:49 1977/8/4 4/8/1977
adam@aftonbladet.se 38867 941-964-6302 $1949.27 116.241.143.196 http://flexomat.com 23:35 1995/7/27 27/7/1995
devo@donuts.com 51426 941-964-1234 $1067.00 88.96.149.82 http://www.polyester.se 15:17 1986/1/5 5/1/1986
henry@samba.org 40859 941-964-4856 $3401.19 68.152.250.74 http://www.flexomat.com 4:36 1990/3/7 7/3/1990
found@dotnet.ca 23986 941-964-2686 $1393.52 98.102.181.138 http://lostnfound.org 5:51 1993/7/22 22/7/1993
carl@fish.org 73392 941-964-5792 $3876.04 246.234.182.243 http://www.google.se 6:52 1984/7/14 14/7/1984
found@mountdev.net 03519 941-964-1599 $1176.48 104.212.122.177 http://donutsx.com 18:52 2000/8/6 6/8/2000

Table example uses following code:

$('input#id_search').quicksearch('table#table_example tbody tr');

Example with options — search with email regexp on <th> only

Loading...
Email Id Phone Total Ip Url Time ISO Date UK Date
devo@flexomat.com 66672 941-964-8535 $2482.79 172.78.200.124 http://gmail.com 15:10 1988/12/14 14/12/1988
henry@mountdev.net 35889 941-964-9543 $2776.09 119.232.182.142 http://www.gmail.com 3:54 1974/1/19 19/1/1974
christian@reno.gov 60021 941-964-5617 $2743.41 167.209.64.181 http://www.dotnet.ca 10:58 2000/3/25 25/3/2000
muffins@donuts.com 17927 941-964-9511 $2998.18 210.214.231.182 http://google.se 21:22 1993/1/24 24/1/1993
muffins@reno.gov 76375 941-964-2757 $1836.09 220.222.93.171 http://www.samba.org 15:22 1988/4/4 4/4/1988
mendez@gmail.com 45834 941-964-2575 $2805.46 228.170.245.253 http://flexomat.com 11:31 1975/12/12 12/12/1975
dev@gmail.com 20022 941-964-4967 $3296.54 175.248.70.240 http://www.flexomat.com 4:27 2002/7/3 3/7/2002
foo@polyester.se 55977 941-964-745 $2953.73 222.114.227.156 http://www.donuts.com 23:49 1977/8/4 4/8/1977
adam@aftonbladet.se 38867 941-964-6302 $1949.27 116.241.143.196 http://flexomat.com 23:35 1995/7/27 27/7/1995
devo@donuts.com 51426 941-964-1234 $1067.00 88.96.149.82 http://www.polyester.se 15:17 1986/1/5 5/1/1986
henry@samba.org 40859 941-964-4856 $3401.19 68.152.250.74 http://www.flexomat.com 4:36 1990/3/7 7/3/1990
found@dotnet.ca 23986 941-964-2686 $1393.52 98.102.181.138 http://lostnfound.org 5:51 1993/7/22 22/7/1993
carl@fish.org 73392 941-964-5792 $3876.04 246.234.182.243 http://www.google.se 6:52 1984/7/14 14/7/1984
found@mountdev.net 03519 941-964-1599 $1176.48 104.212.122.177 http://donutsx.com 18:52 2000/8/6 6/8/2000

Table example uses following code:

$('input#id_search2').quicksearch('table#table_example2 tbody tr', {
	'delay': 300,
	'selector': 'th',
	'stripeRows': ['odd', 'even'],
	'loader': 'span.loading',
	'bind': 'keyup click',
	'show': function () {
		this.style.color = '';
	},
	'hide': function () {
		this.style.color = '#ccc';
	},
	'prepareQuery': function (val) {
		return new RegExp(val, "i");
	},
	'testQuery': function (query, txt, _row) {
		return query.test(txt);
	}
});

Ajax example

Example uses following code:

var qs = $('input#id_search_list').quicksearch('ul#list_example li');

$.ajax({
	'url': 'example.json',
	'type': 'GET',
	'dataType': 'json',
	'success': function (data) {
		for (i in data['list_items']) {
			$('ul#list_example').append('<li>' + data['list_items'][i] + '</li>');
		}
		qs.cache();
	}
});

$('input#add_to_list').click(function () {
	$('ul#list_example').append('<li>Added on click</li>');
	qs.cache();
});

Super table example

More information and download at Github