Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to write a cell phone number in an international way using JavaScript?
When you have visitors from worldwide on your websites, it is a good idea to show things like a cell phone number according to international standards. So they can easily understand.
We can use the International Public Telecommunication Numbering Format to represent the cell phone number in an international way. Also, it is represented by the ‘E-164’ format.
We have given the syntax below to follow to write a cell phone number in an international way.
[+] [country code] [local phone number]
Users can see that the international phone number contains ‘+’ initially and ‘country code’ after that, and it contains the local phone number after the country code.
Here, we will use the regular expression and match() method to convert the cell phone number in an international way using JavaScript.
Syntax
Users can follow the syntax below to convert the cell phone number into the international standard format.
let reg = /^(\d{3})(\d{3})(\d{4})$/;
let array = number.match(reg);
In the above syntax, we have written the regular expression to match the phone number
The match method returns an array of all matches. For a valid match, it returns four elements. The first element is the whole phone number of 3 digits, the second element is the first three digits of the phone number, the third element is the middle three digits of the phone number, and the fourth element is the last four digits of a valid phone number.
Regular Expression Explained
^ − It is the start of the regular expression.
(\d{3}) − It represents the three digits at the start.
(\d{3}) − It represents the three digits in the middle.
(\d{4}$) − It represents the four digits at the end.
Example
In the example below, we have added HTML input of the number type. Users can enter a valid cell phone number of 10 digits. When a user clicks the submit button, it executes the writeInternationalNumber() function. We used the above regular expression in the function to match the input value and get matched values in the array format.
After that, we concat the array values in a single string to write the cell phone number according to the international standard.
<html>
<body>
<h3>Using the <i> Regular expression </i> to write a cell phone number in an international way in JavaScript </h3>
<p>Enter phone number:</p>
<input type = "number" id = "cell">
<div id = "content"></div>
<button id = "btn" onclick = "writeInternationalNumber()"> Submit</button>
<script>
let content = document.getElementById('content');
// function to write a cell phone number in the international format
function writeInternationalNumber() {
let cell = document.getElementById('cell');
let number = cell.value;
let reg = /^(\d{3})(\d{3})(\d{4})$/;
let array = number.match(reg);
if(array == null) {
content.innerHTML = "Please enter a valid phone number";
return;
}
let internationalNumber = '+91' + ' (' + array[1] + ') ' + array[2] + '-' + array[3];
content.innerHTML = "The converted phone number is " + internationalNumber;
}
</script>
</body>
</html>
Example
In the example below, we created the country code's dropdown with its value. Users can select any country and write a phone number of 10 digits in the input box. When the user presses the button, it executes the cellNumberWithCountryCode() function, which takes the value of the selected country code and phone number. After that, we create a string like the above example to write input cell phone numbers internationally.
<html>
<body>
<h3>Using the <i> Regular expression </i> to write a cell phone number in an international way in JavaScript </h3>
<select name = "country_code" id = "codes">
<option value = "+91" selected> India (+91) </option>
<option value = "+355"> Albania (+355) </option>
<option value = "+1"> USA (+1) </option>
<option value = "+43"> Austria (+43) </option>
<option value = "+86"> China (+86) </option>
<option value = "+81"> Japan (+81) </option>
<option value = "+31"> Netherlands (+31) </option>
<option value = "+263"> Zimbabwe (+263) </option>
</select>
<input type = "number" id = "cell"> <br>
<div id = "content"> </div> <br>
<button id = "btn" onclick = "cellNumberWithCountryCode()"> Submit</button>
<script>
let content = document.getElementById('content');
// function to write a cell phone number in the international format
function cellNumberWithCountryCode() {
let cell = document.getElementById('cell');
let number = cell.value;
let reg = /^(\d{3})(\d{3})(\d{4})$/;
// get the country code from the dropdown
let country_code = document.getElementById('codes').value;
let array = number.match(reg);
if (array == null) {
content.innerHTML = "Please enter a valid phone number";
return;
}
let internationalNumber = country_code + ' (' + array[1] + ') ' + array[2] + '-' + array[3];
content.innerHTML = "The converted phone number is " + internationalNumber;
}
</script>
</body>
</html>
Users learned to arrange cell phone numbers according to international standards. We have used the regular expression to validate the cell phone number. If the phone number is valid, we show it internationally with the selected country code.
495 Views
