By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
460,044 Members | 1,330 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 460,044 IT Pros & Developers. It's quick & easy.

my onPause Event (efficiency)

Jezternz
100+
P: 145
Not exactly an event but it has the same general purpose. Basicly it will fire the event when the user stops typing for 500 miliseconds. The reason for this, is I have an ajax form and I want the form to validate automaticly (without having to wait for the onchange event to fire). I was wondering first of all if this is a good way to do it? (simplicity please!) and secondly how can I improve this (efficiency wise) or is it fine as is:

Example:
JS:
Expand|Select|Wrap|Line Numbers
  1. function onPause(theobj, qfunction, qverifyifunction){
  2.     if(qfunction && theobj){
  3.         var onp_currenttimer = false;
  4.         var thefunction = function(){
  5.             if(qverifyifunction)qverifyifunction();
  6.             if(onp_currenttimer)clearTimeout(onp_currenttimer);
  7.             onp_currenttimer = setTimeout(qfunction, 500);
  8.         }        
  9.         if (theobj.attachEvent)
  10.             theobj.attachEvent('onkeyup',thefunction)
  11.         else if(theobj.addEventListener)
  12.             theobj.addEventListener('keyup',thefunction,false)
  13.         else 
  14.             alert('Browser is out of date, please update.');
  15.  
  16.     } else alert("function and object arguments required for onPause function.");
  17. }
  18. function offPause(theobj, thefunction){
  19.         if (theobj.detachEvent)
  20.             theobj.detachEvent('onkeyup',thefunction)
  21.         else if(theobj.removeEventListener)
  22.             theobj.removeEventListener('keyup',thefunction,false)
  23.         else 
  24.             alert('Browser is out of date, please update.');
  25. }
  26.  
HTML:
[HTML]
<html>
<head>
<script type="text/javascript" src="onpause.js"></script>
<script type="text/javascript">
<!--
function checkit(){
if(document.getElementById('me').value.length > 6){
document.getElementById('submitbutton').disabled = false;
} else {
document.getElementById('submitbutton').disabled = true;
}
}
function checking(){
document.getElementById('submitbutton').disabled = true;
}
-->
</script>
</head>
<body onload="onPause(document.getElementById('me'), checkit, checking);">
<input type="text" id="me" />
<input type="submit" id="submitbutton" value="Submit!" disabled="disabled">
</body>
</html>
[/HTML]

Thanks in advance, Josh


Edit: Gah, just realised the offPause function will not work, any ideas?
Nov 10 '08 #1
Share this Question
Share on Google+
10 Replies


acoder
Expert Mod 15k+
P: 16,027
Why not just the onkeyup event and be done with it?
Nov 10 '08 #2

Jezternz
100+
P: 145
because I don't want to call on an ajax call multiple times per second, I believe this would put unnecessary pressure on low-end machines (wouldn't it?) not to mention when someone enters all the fields on a register page it would end up calling check.php 20-50 times i'm guessing as apposed to 5-10 times.

So yeh this method I would think would save both client and server system resources and bandwidth.
Nov 10 '08 #3

acoder
Expert Mod 15k+
P: 16,027
I was looking at your code and saw that you were enabling the submit button only. What Ajax calls are made? Even if the user stops typing for half a second, if they type another character, the Ajax call would now be useless.
Nov 11 '08 #4

Jezternz
100+
P: 145
that was only an example to show its use, and yes it does become useless if a user stops then starts typing after half a second, however over that time it will have called the ajax call only twice, not once for every character typed (possibly 10+ times), so not really useless.
Nov 11 '08 #5

acoder
Expert Mod 15k+
P: 16,027
What kind of validation is performed? I'm still not sure why you want to avoid onchange.
Nov 11 '08 #6

Jezternz
100+
P: 145
I use ajax to call a php file that will check (one example) if the username is within certain criteria (length, alphanumeric, ect) then connects to a database and checks if the username is already in use.

Because I want the validation to disable and enable the submit button, if I used onchange the following problem arises:
example:
1. submit button starts disabled.
2. I type in my fields all correctly. Then click somewhere else on the page to fire onchange event (note that even if you click on the submit button while its disabled, it doesnt even fire the onchange event, so the user has to click of somewhere else on the page, which is a little bit of a pain)
3. The submit button becomes enabled.
4. I add something on the end of the last field. (making it invalid)
5. I Click submit -I can do this, as the onchange event wont fire (making the submit button disabled) until I have already clicked it.

Problem: Submit button can be enabled while fields have invalid data.

Thanks, Josh
Nov 11 '08 #7

acoder
Expert Mod 15k+
P: 16,027
Some of the validation you could do without server-side code, or are you trying to keep all validation code in one place?

Note that client-side validation doesn't have to be foolproof. You do as much as you can to help the user avoid seeing an error on the next page.

You can call some validation code onsubmit, but then you'd need a synchronous call (which is usually not a good idea).

If you want to go ahead with this onpause idea anyway, one way would be to use an object that handles it. It would be attached to the onkeyup event. If the event occurs, use setTimeout to call a function after 500 milliseconds (one second might be better) and also abort any previous Ajax requests. The function would obviously make the request and if successful enable the submit button. There's no need for an offpause function.
Nov 12 '08 #8

Jezternz
100+
P: 145
yeh I like to try validate as much as I can client side, but from what I have heard for security reasons you also need to verify server-side?

cheers acoder for baring with me
Nov 12 '08 #9

acoder
Expert Mod 15k+
P: 16,027
Yes, of course you need to validate server-side. What I meant was that not all validation on the client-side necessarily requires server-side code, e.g. length, alphanumeric, etc. Connecting to a database to check if the username already exists would, though.
Nov 13 '08 #10

Jezternz
100+
P: 145
ahhh yes, valid point.

thanks, Josh
Nov 13 '08 #11

Post your reply

Sign in to post your reply or Sign up for a free account.