Today is . Page created 10/29/06

Format Format Telephone Numbers Form Telephone

Enter Telephone Number
(To refresh, hold down shift and press the browser refresh button)

*
* Reset button is not part of the script. Added as a convenience

This script will format a telephone number entered into a text box. Numbers can be entered as 1234567890 and will automatically be formatted as (123)456-7890.

We have tested the code in IE6.0, Firefox1.5.0.7, Opera9.02, Netscape8.1 and AOL Explorer1.2. This script worked well in all platforms with the exception of Opera9.02 where it did not format the numbers correctly. They were formatted in reverse as 45678901(123) with no hyphen (-) between the exchange and the number.

For Your Information For your Information:     Before we begin, we feel obligated to advise you that the above form is for all intensive purposes a "Stand Alone" script. In other words, it really does not do much of anything other than what you see. In order to make it function as designed, you need to incorporate it into a valid working form. If you do not have a good Solid Knowledge of HTML coding, javascripts, forms and reconfigurations, please "Do Not Attempt" this until you are Proficient in the aforementioned areas.

Depending on your knowledge of HTML, javascripts and forms, this is an easy two (2) part copy and paste code that goes in the <HEAD> section and is also incorporated into the <BODY> section of a working form with either none or minimal reconfigurations in the <BODY> section.

When you incorporate the <BODY> section of code into a working form, you may want to remove some text that may not be needed. See below:

<form name=frmPhone>
<font size="4" color="#0000FF"><b>Enter Telephone Number</b></font><br>
(To refresh, hold down shift and press the browser refresh button)<br>
<input type=text name=txtphone maxlength="13" onclick="javascript:getIt(this)" >
</form>

The above color coded line of code may not be needed for two reasons.

  1. Takes up unnecessary space within a form
  2. Most forms have a reset button to remove what is in the respective fields

For Your Information For your Information:     Some forms can become very elaborate and all the coding get very confusing. To alleviate some of this confusion, you may want to consider making the <HEAD> section of this code into an exteral .js file. See below on howto.

  1. The first thing you must do with the code is to remove the opening and closing script tags of the <HEAD> section of code, paste what is left into a notepad and save as phoneFormat.js

          <SCRIPT LANGUAGE="JavaScript"> Opening Script Tag


    <HEAD> section of code is here

          //-->
          </SCRIPT>     Closing Script Tag
  2. Once you have done that, now you will have a file that looks something like this:
    Click on it and you will see exactly what is contained within the file
    When you open it, notice the lack of opening and closing script tags     phoneFormat.js
  3. Once you have done that, now you need to upload the phoneFormat.js file into your directory.
  4. Once you have done that, now you need to insert a snipplet of code into the <HEAD> section of the document where the game will be located.

          <script type="text/javascript" src="phoneFormat.js"> </script>

  5. The above little snipplet of code is what is calling the <HEAD> section of the code to make the effect work.
  6. Once that is done, now incorporate the <BODY> section of code into the working form and you are done. Happy Smiley

If you would like to see a version of this effect making use of the external.js file within the <HEAD> section , grab the below link and you are there.
[ Format Phone Numbers With External.js File ]

For Your Information For your Information:     If you would like a full tutorial on howto make an external .js file, grab the below link and you are there. The above six (6) steps are for all intensive purposes the abridged quick method that usually works for most people.
[ Howto Make An External .js File ]

We hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ]   [ Rate This Page ]