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 7 of 7
  1. #1
    New Coder
    Join Date
    May 2005
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Replacing Enter with Tab

    Hi all,
    Does anybody know how to 'replace' the action that occurs when the ENTER key is pressed. Ie effect when a user presses ENTER I want the browser to behave as if they had pressed the TAB key.

    I'm capturing when a user does this and displaying an alert but I don't know how to cancel the enter and simulate the tab

    Any ideas?
    Why is there a setting on your toaster that burns your toast?

  • #2
    Senior Coder
    Join Date
    Feb 2004
    Location
    Edinburgh
    Posts
    1,352
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i'm not sure it is a good idea, since you're interfering with the accessibility of the browser, never mind the webpage/application itself. note, the browser belongs to the user, not to you, so by changing its default behaviour is wrong.

    why do you want to do this anyway?
    *keep it simple (TM)

  • #3
    New Coder
    Join Date
    May 2005
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It's for a result entry app, hosted on my companies intranet. I want to the user to be able to bang in numeric values and be able to press the enter on the number pad, which'll take them to the next input box and bang in some more numbers and press enter, etc. At the moment pressing enter tries to submit the Form itself, and having to use the mouse to click in the next box or use the Tab key itself is slowing them down
    Why is there a setting on your toaster that burns your toast?

  • #4
    Senior Coder
    Join Date
    Feb 2004
    Location
    Edinburgh
    Posts
    1,352
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by SxChoc
    I want to the user to be able to bang in numeric values and be able to press the enter on the number pad, which'll take them to the next input box and bang in some more numbers and press enter, etc. At the moment pressing enter tries to submit the Form itself
    won't it be confusing, tho, to swap them over. don't understand what's wrong with just tabbing.

    you want to look into using onkeydown and then capturing the keycode for the enter buttons. i believe the answer should be on the forum already, since it's been asked many times before.
    *keep it simple (TM)

  • #5
    New to the CF scene
    Join Date
    May 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Try this.

    <SCRIPT LANGUAGE="JavaScript">

    function tabOnEnter (field, evt) {
    var keyCode = document.layers ? evt.which : document.all ?
    evt.keyCode : evt.keyCode;
    if (keyCode != 13)
    return true;
    else {
    getNextElement(field).focus();
    return false;
    }
    }
    function getNextElement (field) {
    var form = field.form;
    for (var e = 0; e < form.elements.length; e++)
    if (field == form.elements[e])
    break;
    return form.elements[++e % form.elements.length];
    }

    </script>

    <script language="JavaScript"><!--
    function validate(qty,num) {
    if (qty.value == '')
    qty.value = num;
    }
    //--></script>



    and then in the body....

    <TR>
    <TD ALIGN=RIGHT><INPUT TYPE="text" NAME="ITEM1" SIZE="7" MAXLENGTH="6" onkeydown="return tabOnEnter (this, event);" onFocus="this.select()">
    <TD ALIGN=LEFT ><INPUT TYPE="text" NAME="QTY1" SIZE="3" MAXLENGTH="3" onkeydown="return tabOnEnter (this, event);" onBlur="validate(this.form.QTY1,'1')" onFocus="this.select()">

    <TR>
    <TD ALIGN=RIGHT><INPUT TYPE="text" NAME="ITEM2" SIZE="7" MAXLENGTH="6" onkeydown="return tabOnEnter (this, event);" onFocus="this.select()">
    <TD ALIGN=LEFT ><INPUT TYPE="text" NAME="QTY2" SIZE="3" MAXLENGTH="3" onkeydown="return tabOnEnter (this, event);" onBlur="validate(this.form.QTY2,'1')" onFocus="this.select()">
    <TR>
    <TD ALIGN=RIGHT><INPUT TYPE="text" NAME="ITEM3" SIZE="7" MAXLENGTH="6" onkeydown="return tabOnEnter (this, event);" onFocus="this.select()">
    <TD ALIGN=LEFT ><INPUT TYPE="text" NAME="QTY3" SIZE="3" MAXLENGTH="3" onkeydown="return tabOnEnter (this, event);" onBlur="validate(this.form.QTY3,'1')" onFocus="this.select()">

    <TR>
    <TD ALIGN=RIGHT><INPUT TYPE="text" NAME="ITEM4" SIZE="7" MAXLENGTH="6" onkeydown="return tabOnEnter (this, event);" onFocus="this.select()">
    <TD ALIGN=LEFT ><INPUT TYPE="text" NAME="QTY4" SIZE="3" MAXLENGTH="3" onkeydown="return tabOnEnter (this, event);" onBlur="validate(this.form.QTY4,'1')" onFocus="this.select()">

    <TR>
    <TD ALIGN=RIGHT><INPUT TYPE="text" NAME="ITEM5" SIZE="7" MAXLENGTH="6" onkeydown="return tabOnEnter (this, event);" onFocus="this.select()">
    <TD ALIGN=LEFT ><INPUT TYPE="text" NAME="QTY5" SIZE="3" MAXLENGTH="3" onkeydown="return tabOnEnter (this, event);" onBlur="validate(this.form.QTY5,'1')" onFocus="this.select()">



    HTH,
    Clint

  • #6
    New Coder
    Join Date
    May 2005
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Cheers matey,

    I'll give that a blast
    Why is there a setting on your toaster that burns your toast?

  • #7
    New Coder
    Join Date
    May 2005
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That code throwing an error at line 17 (Object required). I've worked out how to do in VBScript, which I call from the main Java function (window.event.keycode=9).

    Thanks for you time
    Why is there a setting on your toaster that burns your toast?


  •  

    Posting Permissions

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