Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
29 changed files
with
391 additions
and
50 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,49 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Example: Display an existing number</title> | ||
| <link rel="stylesheet" href="../css/prism.css"> | ||
| <link rel="stylesheet" href="../../build/css/intlTelInput.css?1537717752654"> | ||
| <link rel="stylesheet" href="../../build/css/demo.css?1537717752654"> | ||
|
|
||
|
|
||
| <!-- GOOGLE ANALYTICS --> | ||
| <script> | ||
| (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ | ||
| (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), | ||
| m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) | ||
| })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); | ||
| ga('create', 'UA-85394876-1', 'auto'); | ||
| ga('send', 'pageview'); | ||
| </script> | ||
| <!-- /GOOGLE ANALYTICS --> | ||
| </head> | ||
|
|
||
| <body> | ||
| <a href="/">Back</a> | ||
| <h1>Example: Display an existing number</h1> | ||
| <p>We initialise the plugin on an input which already contains a full international number. The plugin will automatically select the relevant flag, and re-format the number to national format.</p> | ||
|
|
||
| <h2>Markup</h2> | ||
| <pre><code class="language-markup"><input id="phone" type="tel" value="+447733312345"> | ||
| </code></pre> | ||
|
|
||
| <h2>Code</h2> | ||
| <pre><code class="language-javascript">var input = document.querySelector("#phone"); | ||
| window.intlTelInput(input, { | ||
| utilsScript: "../../build/js/utils.js?1537717752654" // just for formatting/placeholders etc | ||
| }); | ||
| </code></pre> | ||
|
|
||
| <h2>Result</h2> | ||
| <div id="result"> | ||
| <input id="phone" type="tel" value="+447733312345"> | ||
|
|
||
| </div> | ||
|
|
||
| <script src="../js/prism.js"></script> | ||
| <script src="../../build/js/intlTelInput.js?1537717752654"></script> | ||
| <script src="./js/displayNumber.js?1537717752654"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,68 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>Example: Using the promise returned from initialisation</title> | ||
| <link rel="stylesheet" href="../css/prism.css"> | ||
| <link rel="stylesheet" href="../../build/css/intlTelInput.css?1537717752654"> | ||
| <link rel="stylesheet" href="../../build/css/demo.css?1537717752654"> | ||
|
|
||
|
|
||
| <!-- GOOGLE ANALYTICS --> | ||
| <script> | ||
| (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ | ||
| (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), | ||
| m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) | ||
| })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); | ||
| ga('create', 'UA-85394876-1', 'auto'); | ||
| ga('send', 'pageview'); | ||
| </script> | ||
| <!-- /GOOGLE ANALYTICS --> | ||
| </head> | ||
|
|
||
| <body> | ||
| <a href="/">Back</a> | ||
| <h1>Example: Using the promise returned from initialisation</h1> | ||
| <p>Use this promise to know when the plugin has completely finished initialising, including completing any asynchronous actions you might have enabled with the initialisation options e.g. fetching utils.js with the utilsScript option, and performing the ip lookup with the geoIpLookup option.</p> | ||
|
|
||
| <h2>Markup</h2> | ||
| <pre><code class="language-markup"><!-- polyfill for IE11 --> | ||
| <script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script> | ||
|
|
||
| <p> | ||
| Status: | ||
| <span id="status">Initialising...</span> | ||
| </p> | ||
| <input id="phone" type="tel"> | ||
| </code></pre> | ||
|
|
||
| <h2>Code</h2> | ||
| <pre><code class="language-javascript">var input = document.querySelector("#phone"); | ||
| var statusElement = document.querySelector("#status"); | ||
|
|
||
| var iti = window.intlTelInput(input, { | ||
| utilsScript: "../../build/js/utils.js?1537717752654", | ||
| }); | ||
| iti.promise.then(function() { | ||
| statusElement.innerHTML = "Initialised!"; | ||
| }); | ||
| </code></pre> | ||
|
|
||
| <h2>Result</h2> | ||
| <div id="result"> | ||
| <!-- polyfill for IE11 --> | ||
| <script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script> | ||
|
|
||
| <p> | ||
| Status: | ||
| <span id="status">Initialising...</span> | ||
| </p> | ||
| <input id="phone" type="tel"> | ||
|
|
||
| </div> | ||
|
|
||
| <script src="../js/prism.js"></script> | ||
| <script src="../../build/js/intlTelInput.js?1537717752654"></script> | ||
| <script src="./js/initPromise.js?1537717752654"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| var input = document.querySelector("#phone"); | ||
| window.intlTelInput(input, { | ||
| utilsScript: "../../build/js/utils.js?1537717752654" // just for formatting/placeholders etc | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,5 @@ | ||
| var input = document.querySelector("#phone"); | ||
| window.intlTelInput(input, { | ||
| hiddenInput: "full_phone", | ||
| utilsScript: "../../build/js/utils.js?1537705480435" // just for formatting/placeholders etc | ||
| utilsScript: "../../build/js/utils.js?1537717752654" // just for formatting/placeholders etc | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| var input = document.querySelector("#phone"); | ||
| var statusElement = document.querySelector("#status"); | ||
|
|
||
| var iti = window.intlTelInput(input, { | ||
| utilsScript: "../../build/js/utils.js?1537717752654", | ||
| }); | ||
| iti.promise.then(function() { | ||
| statusElement.innerHTML = "Initialised!"; | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| var inputHome = document.querySelector("#home"); | ||
| var inputMobile = document.querySelector("#mobile"); | ||
|
|
||
| window.intlTelInput(inputHome, { | ||
| initialCountry: 'gb', | ||
| placeholderNumberType: 'FIXED_LINE', | ||
| utilsScript: "../../build/js/utils.js?1537717752654" // just for formatting/placeholders etc | ||
| }); | ||
| window.intlTelInput(inputMobile, { | ||
| initialCountry: 'gb', | ||
| placeholderNumberType: 'MOBILE', | ||
| utilsScript: "../../build/js/utils.js?1537717752654" | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.