As I understand they have removed the autoformat option on the latest International Telephone Input library.This option formatted the number accordingly to the country the user choose. But according to the forms, i can still use util.js and format-number function to achieve this options (https://github.com/jackocnr/intl-tel-input/wiki/utils.js) I tried multiple times but not being able to apply this option. For example for US Number, how would I format the number to this ex:(201)-255-6655. This is my code below. As I see this seems to be the best js library for international numbers.
function phoneFormatter() {
$('.phone').on('input', function() {
var number = $(this).val().replace(/[^\d]/g, '')
if (number.length == 7) {
number = number.replace(/(\d{3})(\d{4})/, "$1-$2");
//US & Canada Formatting
} else if (number.length == 10) {
number = number.replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
}
//France Formatting
else if (number.length == 11) {
number = number.replace(/(\d{2})(\d{1})(\d{2})(\d{2})(\d{2})(\d{2})/, "+$1 $2 $3 $4 $5 $6");
}
//German Formattiing
else if (number.length == 13) {
number = number.replace(/(\d{2})(\d{3})(\d{8})/, "+$1 $2 $3");
}
$(this).val(number)
});
};
$(phoneFormatter);
<script type="text/javascript” src=”/_layouts/MicrosoftAjax.js" ></script>
<script type="text/javascript” src=”/_layouts/SP.debug.js" ></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/validator/8.2.0/validator.js"></script>
<html>
<body>
<p><label>Phone Number<br>
<input name="phone" class="phone" id="phone" type="text" required></label></p>
</body>
</html>