This is a jQuery plugin that turns any textbox into a live search, or a “searchbox”.
$('input.search').searchbox()That’s it, really. There are a few configuration options:
url– a GET request is sent to this url (default: ‘/search’)param– the actually parameter that gets sent to the server (default: ‘query’)dom_id– the element that gets updated with the results (default: ‘#results’)delay– the keystroke delay (default: 100 ms)loading_css– the css for an ajax spinner/loading bar (default: ‘#loading’)
So, customizing each config option might look like this:
$('input.search').searchbox({
url: '/your/search/url',
param: 'q',
dom_id: '#thumbnails',
delay: 250,
loading_css: '#spinner'
})There are a few places you can hook into the plugin by binding a function to specific events. Here are the events:
init.searchbox– triggered once when the plugin code executesbefore.searchbox– triggered right before the search is performedafter.searchbox– triggered right after the search completes
Here’s an example of how to make use of them:
$(document).bind('init.searchbox', function() { ... })© 2009 Ryan Heath, released under the MIT license