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

    javascript field help

    Hello,

    I have a requirement to have three text fields ssn1, ssn2, ssn3.

    these fields need to automatically go to the next field after three numbers are entered.

    for example if i enter 123 into text field ssn1, i want the focus to be on ssn2 field, without tabbing. Is there a way to do this?

    Thanks in advance.

  • #2
    teh Moderatorinator
    Join Date
    Sep 2004
    Location
    USA
    Posts
    2,472
    Thanks
    4
    Thanked 40 Times in 40 Posts
    Sure is.
    Check the length if your fields, and when they have reached the amount you want, send the focus() to the next text box...
    There are plenty of scripts online that will help you if you do a google...

  • #3
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well yes, I knew that much, but thanks for your help. My problem was getting to the point where i could check the length. I found the answer to this problem however at this helpful tutorial.

    http://www.htmlcodetutorial.com/form...msupp_162.html

    if this link is down, the code is here

    *******************************************************

    <SCRIPT TYPE="text/javascript">
    <!--
    var downStrokeField;
    function autojump(fieldName,nextFieldName,fakeMaxLength)
    {
    var myForm=document.forms[document.forms.length - 1];
    var myField=myForm.elements[fieldName];
    myField.nextField=myForm.elements[nextFieldName];

    if (myField.maxLength == null)
    myField.maxLength=fakeMaxLength;

    myField.onkeydown=autojump_keyDown;
    myField.onkeyup=autojump_keyUp;
    }

    function autojump_keyDown()
    {
    this.beforeLength=this.value.length;
    downStrokeField=this;
    }

    function autojump_keyUp()
    {
    if (
    (this == downStrokeField) &&
    (this.value.length > this.beforeLength) &&
    (this.value.length >= this.maxLength)
    )
    this.nextField.focus();
    downStrokeField=null;
    }
    //-->
    </SCRIPT>


    ******************************************************

    <FORM ACTION="../cgi-bin/mycgi.pl" METHOD=POST>

    SSN:
    <INPUT TYPE=TEXT NAME="ssn_1" MAXLENGTH=3 SIZE=3> -
    <INPUT TYPE=TEXT NAME="ssn_2" MAXLENGTH=2 SIZE=2> -
    <INPUT TYPE=TEXT NAME="ssn_3" MAXLENGTH=4 SIZE=4><BR>

    email: <INPUT TYPE=TEXT NAME="email"><BR>

    </FORM>

    ********************************************************

    <SCRIPT TYPE="text/javascript">
    <!--
    autojump('ssn_1', 'ssn_2', 3);
    autojump('ssn_2', 'ssn_3', 2);
    autojump('ssn_3', 'email', 4);
    //-->
    </SCRIPT>


    This tutorial was very helpful. I must give all credit to the found at htmlcodetutorial.com


  •  

    Posting Permissions

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