Hi
I’ve developed a simple auto suggest for my site - its similar to facebooks in that it comes up with people (friends) of the person as they’re typing into the search box at the top of my page.
It’s probably a bit messy in that the search box’s html looks like this:
<input autocomplete="off" type="text" id="search_box" name="q" class="search_box" value="Search" onfocus="this.value = '';" onKeyUp = "typeahead(this)" onblur="if(this.value=='') this.value='Search'; setTimeout('hide(\\'search_top\\')',500);" />
<span class="results_box_hidden" style="display: none" id="search_top">Loading...</span>
The original problem i was having before i had the Timeout function, was that if you clicked on a result that came up, the box would hide (blur event of input kicking in) before the hyperlink was executed. After i added the timeout it seems to work okay, although its getting pretty messy.
If quite a few results turn up i add a scroll bar to the results so that the list doesn’t go all the way down the page, and in firefox and some others this works fine. But in Safari and Chrome (possibly others) when you click on the scroll bar it fires the blur event of the search box thus hiding the results.
So my question is can i fix this somehow? Or otherwise is there a way to neaten this up a whole lot and solve this problem at the same time?
Thanks!