Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Mar 2012
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Detecting a keyCode for TAB during on blur

    Hi,

    I have do a calculation when an user enters the value in the textbox during onblur event. But during the onblur event I need to capture the tabkey (keyCode) and if it is 9 do the calculate else not do that. But the problem is we cannot detect a keyCode for tab in onblur. But for sure I need to use onblur in this case and cannot use onkeydown as this will have impact on the UI screen for this particular scenario. How to go about this?
    in the textbox I am calling onblur = "test()"

    Please provide a helping hand.

    Thanks.

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    That field doesn't receive the tab key. The browser intercepts the tab key and actions it and so it never reaches anywhere the JavaScript can see with respect to that field.

    You might be able to detect it with the window.onkeypress event
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,303
    Thanks
    203
    Thanked 2,562 Times in 2,540 Posts
    Code:
    <input type = "text" id = "textfield" size = "20" onkeydown = "chk(event)">
    
    <script type = "text/javascript">
    
    function chk(ev) {
    var key;
    ev = ev || event;
    key = ev.keyCode;
    if (key == 9) {
    alert ("You pressed the TAB key");
    return false;
    }
    }
    
    </script>

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #4
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by Philip M View Post
    keydown
    browsers don't pass the actual code of the key that is pressed into that event as they haven't yet received the code when they trigger that event. When the code is received the keypress event is triggered. At least that's always been my understanding of the difference between those two events and corresponds to what testing I have done with them.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #5
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    Quote Originally Posted by felgall View Post
    browsers don't pass the actual code of the key that is pressed into that event as they haven't yet received the code when they trigger that event. When the code is received the keypress event is triggered. At least that's always been my understanding of the difference between those two events and corresponds to what testing I have done with them.
    Not sure what you're waffling on about .

    philip_m's code works fine in my IE9 and FF11 running on an xampp server. But I would have used onkeypress instead of onkeydown
    Last edited by webdev1958; 03-18-2012 at 02:51 AM.

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by webdev1958 View Post
    Not sure what you're waffling on about
    The keydown event isn't guaranteed to receive the keycode as it is intended to test whether ANY key has been pressed (including those that don't have keycodes).

    The keypress event is guaranteed to have the keycode available.

    keydown is triggered by a key (any key being depressed)
    keypress is triggered by a character being typed

    where you are interested in the keycode you should be using the keypress event as then you don't waste time on processing key presses that don't generate characters of input for example CTRL, SHIFT, ALT, scroll lock, pause,the window key, and the contextmenu key all trigger a keydown event but don't trigger a keypress event because they don't have a keycode to pass.
    Last edited by felgall; 03-18-2012 at 03:17 AM.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,303
    Thanks
    203
    Thanked 2,562 Times in 2,540 Posts
    Quote Originally Posted by webdev1958 View Post
    philip_m's code works fine in my IE9 and FF11 running on an xampp server. But I would have used onkeypress instead of onkeydown
    When I test it using onkeypress nothing happens. As felgall says, keypress is triggered by a character being typed, not a key being presed.

    My understanding is that the onkeypress event is not fired for all keys (e.g. ALT, CTRL, SHIFT, ESC) in all browsers. To detect only whether the user has pressed a key, IMO you should use the onkeydown event instead, because it works for all keys, including TAB.
    Last edited by Philip M; 03-18-2012 at 10:45 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #8
    Senior Coder Logic Ali's Avatar
    Join Date
    Sep 2010
    Location
    London
    Posts
    1,028
    Thanks
    0
    Thanked 207 Times in 202 Posts
    Quote Originally Posted by contactanantha View Post
    Hi,

    But during the onblur event I need to capture the tabkey (keyCode) and if it is 9 do the calculate else not do that.
    What if the blur wasn't the result of a keystroke?

    You could apply an onblur handler to all form elements, which stores a reference to that element in a persistent variable. Then you have a record of which element had the focus last. If it was the one in question, don't do the calculation. No key reading needed.

  • #9
    New to the CF scene
    Join Date
    Mar 2012
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks. The problem as I stated before when i use onkeydown I am able to detect the keyCode for TAB , but I want to handle on blur event once the key has been detected as TAB. How to do that any examples are appreciated.


  •  

    Posting Permissions

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