最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Cant get data from intlTelInput - Stack Overflow

programmeradmin3浏览0评论

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
Add a ment  | 

2 Answers 2

Reset to default 4

You 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 
发布评论

评论列表(0)

  1. 暂无评论