www.webdeveloper.com
Results 1 to 4 of 4

Thread: Easy Input Feilds

  1. #1
    Join Date
    Jul 2008
    Posts
    38

    Easy Input Feilds

    I am looking for the easiest way to Input a Phone Number.

    Currently I have 3 fields, (One) -Two-Three

    I have field 1 set to 4 characters, in case the number is 1800. I am thinking of making that a 4th field.

    What my goal is is to have the USER not stop typing the number. This way when they type the first 3 numbers, it tabs them over into the 2nd field. and when that is full, it tabs them into the final field.

    Is this done with events? Is this done with JAVA? Something along the lines of If characters in field 1 = 3 keystroke=TAB. to move the cursor into the 2nd feild.

    Any other methods are welcome. Please help Thanks!

  2. #2
    Join Date
    Jul 2008
    Posts
    38

    Solved

    <script type="text/javascript" >
    function toUnicode(elmnt,content)
    {
    if (content.length==elmnt.maxLength)
    {
    next=elmnt.tabIndex
    if (next<document.maxform.elements.length)
    {
    document.maxform.elements[next].focus()
    }
    }
    }
    </script>

    <form name="maxform">

    and then
    <input size="1" tabindex="12" maxlength="1" onkeyup="toUnicode(this,this.value)">
    <input size="3" tabindex="13" maxlength="3" onkeyup="toUnicode(this,this.value)">
    <input size="3" tabindex="14" maxlength="3" onkeyup="toUnicode(this,this.value)">
    <input size="4" tabindex="15" maxlength="4" onkeyup="toUnicode(this,this.value)">

    Found it!

  3. #3
    Join Date
    Nov 2010
    Location
    Los Angeles, CA
    Posts
    234
    Quote Originally Posted by EliteGhost View Post
    Is this done with events? Is this done with JAVA?
    If you mean JavaScript and not Java, the answer is yes. You will have to switch focus from one field to the next as soon as you detect a certain number of digits in one box. If you intend to support international phone numbers then you may have to change a few things around since they are formatted differently.

  4. #4
    Join Date
    Nov 2002
    Location
    Flint, Michigan, USA
    Posts
    588
    Quote Originally Posted by EliteGhost View Post
    I am looking for the easiest way to Input a Phone Number.

    Currently I have 3 fields, (One) -Two-Three

    I have field 1 set to 4 characters, in case the number is 1800. I am thinking of making that a 4th field.

    What my goal is is to have the USER not stop typing the number. This way when they type the first 3 numbers, it tabs them over into the 2nd field. and when that is full, it tabs them into the final field.

    Is this done with events? Is this done with JAVA? Something along the lines of If characters in field 1 = 3 keystroke=TAB. to move the cursor into the 2nd feild.

    Any other methods are welcome. Please help Thanks!
    I use a single, free-format input field and then process it using a JavaScript function. The function will accept over forty different USA input formats and most foreign-format numbers. It then returns the number in whatever format you wish. For instance, a number entered as "1-800-555-0111" can be returned to you as "8005550111" or "1(800)555-0111" or any of the other forty formats as you specify. It can also accept character "numbers" like "1-800-HOLIDAY" for Holiday Inn.

    The function is too large to post. If you'd like a copy, sticky-message me and ask for my phonfmt.js file. It's free.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles