SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)

    pausing event listeners?

    I have been toying around with a PURE JAVASCRIPT ( not jQuery) script that validates form inputs when the user presses <enter>.
    'onload', the script attaches an "onkeyup" event listeners to all the relevant inputs, so that the actions can run unobtrusively . It checks for the key stroke, if it's <enter> , it runs the validation function.

    So far so good.

    The problem is, I would like to use an alert() to deliver my validation message but if the user hits <enter> to close the alert window.. this too is registered as a keystroke on the field, so of course the alert immediately pops up again; the only way to close the alert window is to use the mouse to click on "close", and that's not very user friendly.

    I used this.blur() so as to 'deafen' the event listener temporarily ( or thus was my intent). Of course the problem with that is that when the user closes the window the field is no longer highlighted ( doesn't have focus) and that isn't very user friendly either.


    I tried this which just put me back to where I was before, but I will admit it was grasping at straws:

    Code:
    				 function keyPressCheck(e,args){ 
    				  if (e.keyCode==13){
    				  	this.blur();
    				  	v=checkField(this.value);      
    				  	alert(v);
    					this.focus();
      				  }
      				}
    So my question is, is there a way to 'pause' a listener or make it so that it's not active when an alert window is up?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by dresden_phoenix View Post
    the script attaches an "onkeyup" event listeners to all the relevant inputs, so that the actions can run unobtrusively
    Wouldn't the same effect be achieved much more easily, and without the complexity, just by attaching an event on to the form submit event?

    Code javascript:
    form.onsubmit = function (evt) {
        var isValid = true;
        ...
     
        return isValid;
    }

    You can use document.activeElement to obtain the currently active field, for example.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Sorry I should have commented my code. The provided function merely controls WHEN the validation is triggered; When <enter >is pressed call the validation function, checkField. checkField returns false if it passes val, and a message pertaining to the error if it doesn't.

    Wouldn't the same effect be achieved much more easily, and without the complexity, just by attaching an event on to the form submit event?
    I want the validation to occur when field is filled, ( so one field at a time, when <enter> ( I may add <tab> latter) is pressed).
    The problem am having is really with the alert() tho.

    pressing <return> to close the alert window, acts as if you have pressed return on the field begin validated. Thus it's a virtual infinite loop.


    You can use document.activeElement to obtain the currently active field, for example.
    so how would I do this while the alert window is up? the problem seems to be that the script continues to operate even while he alert is up. So, even if I take focus away from the active field, accomplished easily enough, I want to be able to return focus to the same element when the alert window is closed.

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by dresden_phoenix View Post
    I want the validation to occur when field is filled, ( so one field at a time, when <enter> ( I may add <tab> latter) is pressed).
    That seems to be a simple problem with an easy solution - remove the onkeyup and enter checking, and use the onchange event on the fields instead. That is the best way to perform what it seems that you want to do.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    Holly crap it's Saturday at 5pm, but I must be sleepy.. and still you beat me to the punch.. lol

    As you just suggested, I went back not keyPressCheck(), but to the function am using to attach event listeners and I attached 'onkeypress' instead of 'onkeyup'( it also worked with 'onkeydown' and 'blur') and it worked as expected , even without the convoluted mechanism I used in my OP.

    But you are right tho. 'onchange' seems to be the most logical event to use to achieve this. Thank Paul!

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by dresden_phoenix View Post
    But you are right tho. 'onchange' seems to be the most logical event to use to achieve this. Thank Paul!
    You're welcome.

    It's time like this that I'm reminded of the following quote:
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." --Brian Kernighan

    So rephrasing that in a better light, not only does writing our code in a simple and clear manner help us to debug it more effectively, but it also makes it easier for us and others to understand our code too.
    Last edited by paul_wilkins; Apr 20, 2013 at 16:38.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •