![]() Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /home/corals/clinic.corals.io/node_modules/intl-tel-input/examples/gen/ |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Example: Multiple Instances</title> <link rel="stylesheet" href="../css/prism.css"> <link rel="stylesheet" href="../../build/css/intlTelInput.css?1613236686837"> <link rel="stylesheet" href="../../build/css/demo.css?1613236686837"> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-N472J4QKC4"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-N472J4QKC4'); </script> </head> <body> <a href="/">Back</a> <h1>Example: Multiple Instances</h1> <p>Here you can see multiple instances of the plugin working alongside each other. I've set the placeholderNumberType differently for each instance to highlight that the instances are completely independent of each other.</p> <h2>Markup</h2> <pre><code class="language-markup">Home: <input id="home" type="tel"> <br><br> Mobile: <input id="mobile" type="tel"> </code></pre> <h2>Code</h2> <pre><code class="language-javascript">var inputHome = document.querySelector("#home"); var inputMobile = document.querySelector("#mobile"); window.intlTelInput(inputHome, { initialCountry: 'gb', placeholderNumberType: 'FIXED_LINE', utilsScript: "../../build/js/utils.js?1613236686837" // just for formatting/placeholders etc }); window.intlTelInput(inputMobile, { initialCountry: 'gb', placeholderNumberType: 'MOBILE', utilsScript: "../../build/js/utils.js?1613236686837" }); </code></pre> <h2>Result</h2> <div id="result"> Home: <input id="home" type="tel"> <br><br> Mobile: <input id="mobile" type="tel"> </div> <script src="../js/prism.js"></script> <script src="../../build/js/intlTelInput.js?1613236686837"></script> <script src="./js/multipleInstances.js?1613236686837"></script> </body> </html>