Jump to content

Convert Text Number To Phone Format.


Recommended Posts

Hello,

 

How can I make an onchnage event trigger a function that converts a number in 1234567890 to (123) 456-7890 format.

 

The function works fine, but the onchange statement does not trigger the function. This is on a single record update form.

 

Thank You.

 

<SCRIPT LANGUAGE="JavaScript">

function phoneFormat(phone) {
phone = phone.replace(/[^0-9]/g, '');
phone = phone.replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
return phone;
}

document.getElementById('EditRecordPhone_Home').onchange=phoneFormat(document.getElementById('EditRecordPhone_Home').value);
</SCRIPT>
 

Link to comment
Share on other sites

MayMusic,

 

Thank you for your suggestion all worked fine. For a single record update form with a textbox field called Phone_Home, I used the code below placed in the footer:

 

<SCRIPT LANGUAGE="JavaScript">

function tel()
{

 // Read the content of the textbox
var message = document.getElementById("EditRecordPhone_Home").value;
 

//Skip function if textbox is empty, else you will see () -

if (message != "") {
 

// Strip off all the spaces
document.getElementById("EditRecordPhone_Home").value = (message.replace(/[^\d]/g, ''));

var message1 = document.getElementById("EditRecordPhone_Home").value;
document.getElementById("EditRecordPhone_Home").value = ("(" + message1.substring(0,3) + ") " + message1.substring(3,6) + "-" + message1.substring(6,10));
}
}

 

// Call function when value in the textbox changes
document.getElementById('EditRecordPhone_Home').onchange=tel;

</SCRIPT>

 

 

I have three other fields called Phone_Work, Phone_Cell and Phone_Fax. Would you happen to know a single code that can be called for all four fileds. The other option will be to copy the above code 4 times.

 

Thank You again.

Link to comment
Share on other sites

Then you need to create an array. Try this:

<SCRIPT LANGUAGE="JavaScript">
var o_els = new Array("EditRecordPhone_Work","EditRecordPhone_Cell","EditRecordPhone_Fax") ;

function tel()
{
 // Read the content of the textbox


// var message = document.getElementById("EditRecordPhone_Home").value;
 

//Skip function if textbox is empty, else you will see () -
for (var i = 0; i < o_els.length; i++) {
if (o_els[i] != "") {

var message=document.getElementById(o_els[i]).value;
 

// Strip off all the spaces
document.getElementById(o_els[i]).value = (message.replace(/[^\d]/g, ''));

var message1 = document.getElementById(o_els[i]).value;
document.getElementById(o_els[i]).value = ("(" + message1.substring(0,3) + ") " + message1.substring(3,6) + "-" + message1.substring(6,10));
}
}

 }

// Call function when value in the textbox changes
for (var i = 0; i < o_els.length; i++) {
document.getElementById(o_els[i]).onchange=tel;
}

</SCRIPT>
Link to comment
Share on other sites

  • 2 years later...

I am currently using the above code on an update form to edit three phone fields and it is working well with one exception:

 

I occasionally will have a customer that will remove a phone number and want to leave that field blank. Currently if this is done the field reverts to showing "( ) -".

 

Is there code that I can add to make this field completely blank if the user decides to delete a phone number previously stored?

 

Thank you.

Link to comment
Share on other sites

I tried again and it is still not working. Here is my final code with your edit:

 

<script>
 
var o_els = new Array("EditRecordPublicPhone","EditRecordFaxNumber") ;
 
function tel()
{
 // Read the content of the textbox
 
 
// var message = document.getElementById("o_els").value;
 
 
//Skip function if textbox is empty, else you will see () -
for (var i = 0; i < o_els.length; i++) {
if (o_els != "") {
 
var message=document.getElementById(o_els).value;
 
 
// Strip off all the spaces
document.getElementById(o_els).value = (message.replace(/[^\d]/g, ''));
 
var message1 = document.getElementById(o_els).value;
document.getElementById(o_els).value = ("(" + message1.substring(0,3) + ") " + message1.substring(3,6) + "-" + message1.substring(6,10));
}
}
 
 }
 
// Call function when value in the textbox changes
for (var i = 0; i < o_els.length; i++) {
 
if (o_els){
document.getElementById(o_els).onchange=tel;
}
}
 
</SCRIPT>
 
Am I missing something?
Link to comment
Share on other sites

  • 2 weeks later...

Change the code to the following code to remove extra characters when blank

<SCRIPT LANGUAGE="JavaScript">
var o_els = new Array("EditRecordPublicPhone","EditRecordFaxNumber") ;

function tel()
{
 
for (var i = 0; i < o_els.length; i++) {
if (o_els[i] != "" && document.getElementById(o_els[i]).value) {

var message=document.getElementById(o_els[i]).value;
 
document.getElementById(o_els[i]).value = (message.replace(/[^\d]/g, ''));

var message1 = document.getElementById(o_els[i]).value;
document.getElementById(o_els[i]).value = ("(" + message1.substring(0,3) + ") " + message1.substring(3,6) + "-" + message1.substring(6,10));
} else{document.getElementById(o_els[i]).value ="";

}
}

 }

// Call function when value in the textbox changes
for (var i = 0; i < o_els.length; i++) {

document.getElementById(o_els[i]).onchange=tel;

}

</SCRIPT>

 

Link to comment
Share on other sites

  • 1 month later...
  • 1 year later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

×
×
  • Create New...