jQuery quickSearch plug-in
Examples
Table example
| Id | Phone | Total | Ip | Url | |
|---|---|---|---|---|---|
| devo@flexomat.com | 66672 | 941-964-8535 | $2482.79 | 172.78.200.124 | http://gmail.com |
| henry@mountdev.net | 35889 | 941-964-9543 | $2776.09 | 119.232.182.142 | http://www.gmail.com |
| christian@reno.gov | 60021 | 941-964-5617 | $2743.41 | 167.209.64.181 | http://www.dotnet.ca |
| muffins@donuts.com | 17927 | 941-964-9511 | $2998.18 | 210.214.231.182 | http://google.se |
| muffins@reno.gov | 76375 | 941-964-2757 | $1836.09 | 220.222.93.171 | http://www.samba.org |
| mendez@gmail.com | 45834 | 941-964-2575 | $2805.46 | 228.170.245.253 | http://flexomat.com |
| dev@gmail.com | 20022 | 941-964-4967 | $3296.54 | 175.248.70.240 | http://www.flexomat.com |
| foo@polyester.se | 55977 | 941-964-745 | $2953.73 | 222.114.227.156 | http://www.donuts.com |
| adam@aftonbladet.se | 38867 | 941-964-6302 | $1949.27 | 116.241.143.196 | http://flexomat.com |
| devo@donuts.com | 51426 | 941-964-1234 | $1067.00 | 88.96.149.82 | http://www.polyester.se |
| henry@samba.org | 40859 | 941-964-4856 | $3401.19 | 68.152.250.74 | http://www.flexomat.com |
| found@dotnet.ca | 23986 | 941-964-2686 | $1393.52 | 98.102.181.138 | http://lostnfound.org |
| carl@fish.org | 73392 | 941-964-5792 | $3876.04 | 246.234.182.243 | http://www.google.se |
| found@mountdev.net | 03519 | 941-964-1599 | $1176.48 | 104.212.122.177 | http://donuts.com |
Table example uses following code:
$('table#table_example tbody tr').quicksearch({
position: 'before',
attached: 'table#table_example',
stripeRowClass: ['odd', 'even'],
labelText: 'Search the table'
});
List example
- Afghanistan
- Albania
- Algeria
- American Samoa
- Andorra
- Angola
- Anguilla
- Antarctica
- Antigua and Barbuda
- Argentina
- Armenia
- Aruba
- Australia
- Austria
- Azerbaijan
Example uses following code:
$('ul#list_example li').quicksearch({
position: 'before',
attached: 'ul#list_example',
loaderText: '',
delay: 100
})
More examples
Usage
$(search_elements).quicksearch(options);
Options
- position
- Where the form is positioned in relation to attached.
- takes: ‘prepend’, ‘append’, ‘before’, ‘after’. default: ‘prepend’.
- attached
- Element to wish form is attached to.
- default: ‘body’
- formId
- Id attribute of form
- default: ‘quicksearch’
- labelText
- Text of form label
- default: ‘Quick Search’
- labelClass
- Class attribute of label
- default: ‘qs_label’
- inputText
- Text of input, will disappear on focus and reappear if field blank on blur.
- default: null
- inputClass
- Class attribute of input
- default: ‘qs_input’
- loaderId
- Id attribute of loader
- default: ‘loader’
- loaderClass
- Class attribute of loader
- default: ‘loader’
- loaderImg
- Makes the loader an image if a string is given
- default: null
- loaderText
- Makes the loader an string of text if no image is given
- default: ‘Loading…’
- stripeRowClass
- Adds a class to each element based on the array given
- default: null. takes: an array of text strings to be classes
- delay
- Keypress delay in milliseconds
- default: 500
- focusOnLoad
- Focuses text input on page load
- default: false.
- hideElement
- Hides/stripes elements parent/grandparent instead of itself.
- default: null. takes: ‘parent’, ‘grandparent’
- onBefore
- An optional function to be called before search
- default: null. takes: function() { }
- onAfter
- An optional function to be called after search
- default: null. takes: function() { }
- filter
- An optional function to edit the search string
- default: null. takes: function(i) { return i; }
- randomElement
- Adds a random string to quickSearch to differentiate between multiple searches
- default: ‘qs’+Math.floor(Math.random()*1000000)
- isFieldset New
- If you want a fieldset instead of a form, useful for developers using ASP.NET
- default: false
- fixWidths New
- If using a table, fix the widths of table cells to stop row widths jumping when searching
- default: false
Download
- Full Javascript (6.5k)
- Compressed version (4.6k)
- Text version