Jump to content

JavaScript to Convert Phone Number to E.164 format


Recommended Posts

Thanks to the Format Phone Number in DataPages how-to article, I've formatted all of my phone numbers to use the US national format of (###) ###-####. This is great for readability; however, I have a downstream integration that requires the E.164 international standard format of +[country_code][subscriber_line]. For example, (123) 456-7890 would become +11234567890. So, I essentially need to strip out all non-numeric characters (including white spaces) and prepend "+1". All of my phone numbers are in the US. This may sound easy, but I'm a citizen developer new to JavaScript so any help would be greatly appreciated. Thanks!

Link to comment
Share on other sites

How are you capturing the phone numbers? Do they select the country, then type in the full number including area code/subscriber line?

Either way, may I suggest a calculated field instead of JS? Just a thought. 

You could make your phone number field into a Calculated Value form element. Then, use Virtual Fields in place of the real phone number field on your form or wherever you enter this information. Then you can just use something simple in the calculated value to get the results you want. You can get rid of area code and just have the phone number field too.

phonenumbers2.PNG.a9a4a066175d48a103aee642e12b465b.PNG

phonenumbers.PNG.9a324f2191c346af29491cab9065714a.PNG

Link to comment
Share on other sites

@kpcollier, thanks for your suggestion. I'd prefer not to break the phone number up into parts because it's lot easier to enter 10 digits in a single field without having to tab/enter/move from field to field. But, I'll keep this in my back pocket if I can't find a JavaScript solution. Thanks!

Link to comment
Share on other sites

@CPCaspio you can do this with javascript easily

You just need to change the ID of your telephone field  in the following code where I called the field fieldParamTel

var inputTel = document.getElementById("fieldParamTel").value;
inputTel = "+1" + inputTel.replace(/[^0-9a-z]/gi, '');

You can then use the inputTel variable for further processing

Or if you want this value in the form itself

document.getElementById("fieldParamTel").onchange  = function() {changeTel("fieldParamTel")};

function changeTel(field){
var inputTel = document.getElementById(field);
cleanTel = inputTel.value.replace(/[^0-9a-z]/gi, '');
inputTel.value = "+1".concat(cleanTel);

}

 

The latter will remove () - etc and add +1

 

Hope this helps

Link to comment
Share on other sites

Just make sure the name of your data page field is replace in both cases below

document.getElementById("fieldParamTel").onchange  = function() {changeTel("fieldParamTel")};

 

Then add the script to the data page footer between <script></script>

 

When you then enter the number and change to another field TAB for example , the function triggers

Link to comment
Share on other sites

@Ulensr, I mistakenly replaced your placeholder with the wrong value. It should have been "EditRecordrp_phone", but it's working now so thanks!

What I really want to do is use the value from a US national phone number field (rp_phone) displayed & stored as (###) ###-#### to populate a separate E.164 phone number field (rp_e164_phone) formatted & stored as +11234567890. This field will be hidden on the datapage and only used for an integration to send SMS. I realize using an extra field just for different formatting isn't ideal, but it's a quick & dirty solution for now.

Thanks again!

Link to comment
Share on other sites

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...