Need advice for acting on only the last onkeyup event in a series

[john.lum]

My overall objective is to create something akin to Google Suggest,
where a query is done in response to changes in a text field presented
to the user.

I've got things working using the onkeyup event and some AJAX
techniques, but I am troubled by one thing: the more characters that
are entered, the slower the interface is to settle down, because a
discrete lookup is done each time the field changes by a single
character.

What I'd prefer is to define a time window (say, n = 500ms) and alter
my code so that it ignores the onkeyup events until at least n ms has
elpased since the last event. I've tried various approaches using
setTimeout, and I'm unable to come up with a working solution to what
seems like a straightforward problem. Various Googlings have not given
me any love, which makes me suspect I'm searching for the wrong things.

Any advice on the best way to achieve this "ignore onkeyup until at
least n ms has elapsed since the last field change" would be greatly
appreciated. Alternative approaches are also welcome.

Thanks,
John

 

[Stephen Chalmers]

My overall objective is to create something akin to Google Suggest,
where a query is done in response to changes in a text field presented
to the user.

I've got things working using the onkeyup event and some AJAX
techniques, but I am troubled by one thing: the more characters that
are entered, the slower the interface is to settle down, because a
discrete lookup is done each time the field changes by a single
character.

What I'd prefer is to define a time window (say, n = 500ms) and alter
my code so that it ignores the onkeyup events until at least n ms has
elpased since the last event. I've tried various approaches using
setTimeout, and I'm unable to come up with a working solution to what
seems like a straightforward problem. Various Googlings have not given
me any love, which makes me suspect I'm searching for the wrong things.

Any advice on the best way to achieve this "ignore onkeyup until at
least n ms has elapsed since the last field change" would be greatly
appreciated. Alternative approaches are also welcome.

Thanks,
John

Did you try something like this?:

var ready=true;

function readText() //keyup handler
{
if(ready)
{
ready=false;
setTimeout("ready=true", 500);

// your processing here

}
}

 

[john.lum]

Thanks much for the suggestion. Your approach didn't quite work for
me; it did not achieve the desired result of deferring response action
until the "final" keypress prior to a delay of at least 500 ms.

However, I did get things working with a modified version that uses
global variables:

//--------------
var keyCount = 0;
var timeoutCount = 0;

function handleKeyUp() // keyup handler
{
keyCount++;
setTimeout("compareCounts()", 350);
}

function compareCounts()
{
timeoutCount++;
if (keyCount == timeoutCount)
{
// my processing goes here
}
}
//--------------

There may be better/non-global-variable techniques involving passing
function references to the setTimeout function, but I will settle for
quick and dirty.

Thanks,
John