Link to home
Start Free TrialLog in
Avatar of Gitcho
Gitcho

asked on

Javascript : how to add delay

I've got a text field that looks like this :

<input type="text" name="my_text_field" onKeyUp="do_this_task();">

The problem is that onKeyUp will call the function "do_this_task()" the very instant the key is "up" ... how do I add a delay in the do_this_task() function, so that the actions will only be performed after a full second of inactivity (or 500 milliseconds or whatever) ?  

If someone types really fast, i'd like there to be a bit of a pause (to give them a brief bit of time to finish typing) before the actions are performed.  Any ideas ?
Avatar of Colosseo
Colosseo
Flag of United Kingdom of Great Britain and Northern Ireland image

Hi

you could do something like this

<input type="text" name="my_text_field" onKeyUp="setTimeout('do_this_task()',500);">

Which will delay for 500 milliseconds however it will run the code for each key press so not sure if it will suit your purpose?

Scott
<input type="text" onkeyup="x=setInterval('yourfunction()',500)"
                           onkeydown="if(x) clearInterval(x)">

and in the function you need to add clearInterval(x) as well

the variable x should be declared as a global boolean:  var x=false;

Cd&
Avatar of Gitcho
Gitcho

ASKER

I think I've almost got it ... did what you said, but still not quite there ...

I'm building a form that builds and submits an LDAP query string to an ASP page which searches AD for users, and returns the results in XML format, and displays a narrowing list as you enter more information about the user (last name, first name, sAMAccountName etc.).  

A server-request is made each time a you enter more info on the user you're searching for, using the onKeyUp - which works fine, but I want the delay to reduce the server round-trips.

here's my HTML code ...
--------------------------------------------------------------------------------------------------------
<input type="text" id="newuser_surname" name="newuser_surname" value="" onKeyUp="x=setInterval('checkSend()',500)" onKeyDown="if(x) clearInterval(x)">
<input type="text" id="newuser_givenName" name="newuser_givenName" value="" onKeyUp="x=setInterval('checkSend()',500)" onKeyDown="if(x) clearInterval(x)">

here's my JAVASCRIPT code ...
--------------------------------------------------------------------------------------------------------
<script>
function checkSend(submit_search)
{
      var tag = "ldap_search_filter_string";
      var LDAPFilter;

      clearInterval(x);
      
      // set the LDAP filter string, based on user input ... eg. (sn=*)(givenName=*)(sAMAccountName=*)
      LDAPFilter = buildLDAPFilter(submit_search ? true : false);

      if (LDAPFilter) {
            // display updated LDAP filter on page
            setInnerHTML(tag,LDAPFilter);
            // send xml object to ASP page for search
            send("",LDAPFilter);
      }
}

</script>
-------------------------------------------------------------

Let me know if you need me to post more code ...

Thanks for your help
The checkSend function is using an argument, but you are not passing anything.  I'm also not sure that half a second is enough time for the necessary server processing unless it is a really fast connection.

Cd&
Actually, that function does not technically break any javascript rules, it's valid.
It may be a logic error, though.  As used it will always pass false to buildLDAPFilter because submit_search will never evaluate to true, it will always be undefined.

I would suggest, also, that you use settimeout instead of setinterval.  settimeout evaluates the function once, after the specified timeout, instead of constantly .. thus you would not need to clear it in the function.
Avatar of Gitcho

ASKER

I pass a boolean to the checkSend function from somewhere else in the form (a "Search Now" button) when I want to perform the query right away, instead of validating input (eg. last name must be at least 3 chars, first name must have 1 .. etc.) before bulding the LDAP filter ... which is why I use "buildLDAPFilter(submit_search ? true : false);" ...

Can I get an example of either the settimeout() or a working setinterval() ?  ...  setinterval() does work for the typing delay, but keeps calling the function after the typing is done.  

I just want a short delay before the query is sent to the ASP page ... (it works just fine at 500ms, even at 100 ms ... LDAP is a very light-weight protocol - by definition) ...
ASKER CERTIFIED SOLUTION
Avatar of java_programmer
java_programmer

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
did you get it working?