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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    onKeyPress compatibility

    I've been searching on this issue for a couple hours, but nothing I've found has led me to a solution. I have the following function:
    Code:
    function submitEnter(buttonId, myfield, e)
    {
            var keycode;
    
            if (window.event) keycode = window.event.keyCode;
            else if (e) keycode = e.which;
    //      else return true;
    
          alert('keycode: ' + keycode);
            if (keycode == 13)
            {
                    alert('enter was pressed');
                    document.getElementById(buttonId).click();
            }
    }
    And the onKeyPress attribute:
    Code:
    onKeyPress="submitEnter('buttonId', 'fieldId');"
    It works fine in IE, but not Firefox. Firefox gives the alert "keycode: undefined" for any key. Obviously, Firefox never knows when the enter key is pressed. I commented out the "else return true;" line because it was causing Firefox not to give an alert at all.

  • #2
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    One error that I see here:
    Code:
    onKeyPress="submitEnter('buttonId', 'fieldId');"
    For Netscape events model compatibility, that should be
    Code:
    onKeyPress="submitEnter('buttonId', 'fieldId',event);"
    In the Netscape events model the event is passed as the first argument to the keypress event handler. If the event is written as an HTML string in an attribute value, that string will be converted to a function like so:
    Code:
    function anonymous(event){
        /* the event handler attribute value */
    }
    So, you should pass that event argument on to any functions you call that need access to the event object.

    That also means that you can change your function to be more browser agnostic:
    Code:
    function submitEnter(buttonID,myfield,e){
        var
            charinput=e.charCode||e.keyCode||e.which;
        alert('Character or Key code: '+charinput+'\nCharacter entered: "'+String.fromCharCode(charinput)+'";);
        if(charinput===13){
            alert('enter was pressed');
            document.getElementById(buttonId).click();
        }
    }
    (untested, but I think it should work as is)


    Have a look at an earlier post I made about this. That should explain character input versus key codes for you.


    Also, have a look at <uri:http://www.din.or.jp/~hagi3/JavaScri...s/KeyEvent.htm> for a page where you can test the behavior of key events on various browsers.
    Last edited by liorean; 05-30-2006 at 08:39 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #3
    Senior Coder
    Join Date
    Feb 2006
    Location
    USA
    Posts
    1,013
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Actually, liorean, I think that problem is that JasonTC is not properly passing the event parameter.

    JasonTC, try making these two changes:
    Code:
    onKeyPress="submitEnter(e, 'buttonId', 'fieldId');"
    Code:
    function submitEnter(e, buttonId, myfield)
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions
    Java != JavaScript && JScript != JavaScript
    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

  • #4
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Quote Originally Posted by Kravvitz
    Actually, liorean, I think that problem is that JasonTC is not properly passing the event parameter.
    Beat you to it
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #5
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nice. All I had to do was add that "event" argument and it works just fine. Thanks a lot.


  •  

    Posting Permissions

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