jquery: simple ajax problem

jquery: simple ajax problem

Hey Peeps

I have this jquery function which works like a autocompletion, much like facebook or google autocompletion.

Code:
       
$("input#search").live("keyup", function(event) {
if (SearchValue != "") {
//About ajax request
$.get("search.php", { text: SearchValue, framed: "1" }, function(data){
//console.log(data);
$("#main_menu_search #main_menu_search_results").html(data);
$("#main_menu_search #main_menu_search_results").show();
});

}
else {
$("#main_menu_search #main_menu_search_results").html("");
}
});













In principal this code works fine, but the problem accuours when some of the ajax.requests is not as fast as others example:

request 1 : 700ms
request 2 : 200ms

then the search result wil first request 2, and then request 1, meaning you wont get the correct search results.

Anyone knows how to overcome this problem?

I know async:false would in theory solve it, one minor thing with this is though, that the total request, for let say P-E-T-E-R would be:

Total time = request 1 + request 2 + request 3 + request 4 + request 5

making the time really long, and weired, because you would get "lagging" results. Im looking for a solution which would ether ignore or terminate old or pending requests.

Any ideas? Or is it even possible?

/jcharnley