Im trying to get extension from intlTelInput plugin on submit, but for some reason it returns empty. Here is an example: /
And the code:
<link rel="stylesheet" href=".min.css?7">
<link rel="stylesheet" href=".css?37">
<form id="my_form">
<input name="phone" type="tel" id="phone" class="form-control">
<input type="submit">
</form>
<!-- use old jquery so demo works in IE -->
<script src=".11.1/jquery.min.js"></script>
<script src=".js?60"></script>
<script>
$("#phone").intlTelInput();
$("#my_form").submit(function () {
alert($("#phone").intlTelInput("getExtension"));
});
</script>
Any idea why its not returning the chosen extension?
Im trying to get extension from intlTelInput plugin on submit, but for some reason it returns empty. Here is an example: https://jsfiddle/msfk6top/
And the code:
<link rel="stylesheet" href="https://intl-tel-input./node_modules/bootstrap/dist/css/bootstrap.min.css?7">
<link rel="stylesheet" href="https://intl-tel-input./node_modules/intl-tel-input/build/css/intlTelInput.css?37">
<form id="my_form">
<input name="phone" type="tel" id="phone" class="form-control">
<input type="submit">
</form>
<!-- use old jquery so demo works in IE -->
<script src="https://ajax.googleapis./ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://intl-tel-input./node_modules/intl-tel-input/build/js/intlTelInput.js?60"></script>
<script>
$("#phone").intlTelInput();
$("#my_form").submit(function () {
alert($("#phone").intlTelInput("getExtension"));
});
</script>
Any idea why its not returning the chosen extension?
Share Improve this question asked Nov 13, 2017 at 20:59 user1985273user1985273 1,96719 gold badges52 silver badges92 bronze badges 1-
Have you provided
utilsScript
? – Joel Kornbluh Commented Nov 13, 2017 at 21:15
2 Answers
Reset to default 4You need to specify the utilsScript
option when initializing the plugin in order for getExtension
to work.
In your plunker, do:
$("#phone").intlTelInput({utilsScript:'https://intl-tel-input./node_modules/intl-tel-input/build/js/utils.js'});
utilsScript
should be the path to the utils.js
script that is included with the intl-tel-input plugin.
Try with this working example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="ENVIAR SMS GRATIS CON BACHECUBANO">
<title>ENVIAR SMS GRATIS CON BACHECUBANO</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn./bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="css/intlTelInput.min.css">
<style>
body {
background-color: #fafafa;
}
.intl-tel-input {
width: 100%;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="card" style="margin-top:50px;">
<!-- <img class="card-img-top" src="..." alt="SMS GRATIS de Bachecubano"> -->
<div class="card-body">
<form class="" action="send.php" method="POST" id="form">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h3 class="card-title text-center">ENVIAR SMS GRATIS CON BACHECUBANO</h3>
<div class="form-group">
<div class="input-group">
<input class="form-control" type="tel" id="phone" name="phone">
<input type="hidden" id="phone2" name="phone2" />
</div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<div class="form-group">
<textarea class="form-control input-sm borderRadius" type="textarea" id="message" name="message" placeholder="Su mensaje