JavaScript autocomplete upon typing

Question

Right guys, all autocomplete plugins and functions that I've found, they only update upon keyup/down, etc. This is fine but the search only begins occurring once the user has stopped typing and if they are typing a phrase or word, the script is unable to instantly start suggesting, etc.

I know this'll be a very simple fix or suggestion for some of you guys, so any help would be greatly appreciated as to how I can convert it to be instantly as a key is pressed.

An example of the desired effect is Google Suggest or Facebook search, a search is fired instantly per key press or change, how do I emulate this?

Thanks!

Answer 1

Is this what you mean? Or do you want Ajax to retrieve from a database?

var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax Utilities".split(" ");
    $("#example").autocomplete(data);

JQuery

Edit: I'm not sure I know what you mean, because this example seems to work identical to Google Suggest or Facebook. If your database was small you could download the cache into the variable data upon page load. If your database was slightly larger you LIMIT the cache to only X number of responses for each alphabetical character or series of characters. (ie. WHERE city LIKE 'aa%' LIMIT 10 AND WHERE...)

Answer 2

The Wicket web framework has the concept of a "throttling" behavior. Normally, AJAX requests in Wicket applications are queued against an "ajax channel", which triggers a request instantly if none is running. If a request is already running, the next request is queued, and triggered when the current one returns.

"Throttling" lets the behavior delay itself for a certain amount of time (say, two seconds). If the behavior fires again in the same period, the callback for the most recent behavior replaces the callback for the current queued behavior. (For example, the user starts typing "albuquerque", which triggers the events "A" then "AL", then "ALB". The system might trigger "A", then "ALB", skipping over "AL" because it was replaced by "ALB" while sitting in the queue.) The object of this is to fire a behavior instantly on each keypress, but prevent the server from being flooded with unnecessary requests.

Check out the wicket ajax source code: http://svn.apache.org/repos/asf/wicket/trunk/wicket/src/main/java/org/apache/wicket/ajax/wicket-ajax.js

For more about the web framework, see: http://wicket.apache.org

Answer 3

It depends on how big the space you're searching is and how good your servers are. Facebook search for (I assume people's names) is quick because you're only really searching through a thousand or so contacts. Google is fast because they invest a lot of money in infrastructure and cache a lot of the responses.

On one of my projects I've used this jQuery plugin and it provides excellent performance on cached results. We used it to provide autocomplete functionality on a list of about 6K contacts (names, etc). Is this what you had in mind?