Search Light jQuery Plugin
I needed a nice looking javascript search result script for a site I’m working on and after looking around for a while I couldn’t find anything that really did what I wanted. So, I took it upon myself to write a nifty jQuery plugin that does exactly what I want.
The plugin is named Search Light. You can view a demo of it and download it using the links at the end of this post. Please let me know what you think of it.

Comments
The position of the popupbox is not correct in Google Chrome 3
Had a check and it works and positions correctly for me in Chrome 2, Opera 9.64, IE 8, Firefox 3 and Safari 3
This is the problem with jQuery. Hundreds of clever folks reinventing every wheel in their own way and throwing it into an unsupported, undocumented mix.
In ExtJs, a simple Ext.form.ComboBox with a custom template can do that:
bc(brush: js). var c = new Ext.form.ComboBox({
renderTo: document.body,
listWidth: ‘auto’,
tpl: ‘<table class="results"><tbody><tpl for=".">’ +
‘<tr>’ +
‘<td class="results-genre"><tpl if="xindex == 1 || parent[xindex - 2].genre !== values.genre">{genre}</tpl></td>’ +
‘<td class="results-name"><img src="{icon}">{name}</td>’ +
‘</tr>’ +
‘<tpl if="xindex < xcount && parent[xindex].genre !== values.genre">’ +
‘<tr class="results-spacer"><td class="results-genre"></td><td class="results-name"></td></tr>’ +
‘</tpl>’ +
‘</tpl></tbody></table>’,
store: new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: ‘sample_data.txt’
}),
reader: new Ext.data.ArrayReader({}, [
‘id’, ‘genre’, ‘name’, ‘icon’
])
}),
mode: ‘remote’,
hideTrigger: true
});
here:
nice example
Been looking for something like this for aaaaaages, can’t wait to try it out!
It doesn’t work in IE-7. Does anybody know the fix. ?
Figure out the problem for IE-7
bc(brush: js). if ($.browser.msie && parseFloat($.browser.version) <= 7) {
results.css({
width: ‘1%’
});
}
change the width value to 100% in js file
Link to tarball is broken?
en ie 7 no funciona mano
dont work in IE 7
plzzzzz can u tell me how to make it read the result from html <p> or <div> tag instead of the text file plzzzzzzzzzzzz
hsf
Super work. Thanks for sharing.
Just one question, It doesn’t work with jquery 1.4 ?
Hi. Can any body tell me how I send more parameters to php script? Thanks
Does anyone know how to change the position of the popupox? Currently, when I type in the search field, the results load on top of the search field area, not beneath it. Thanks.
Add Comment