69 lines
2.5 KiB
HTML
69 lines
2.5 KiB
HTML
|
<!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?1541153396801">
|
||
|
|
<link rel="stylesheet" href="../../build/css/demo.css?1541153396801">
|
||
|
|
|
||
|
|
|
||
|
|
<!-- 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?1541153396801",
|
||
|
|
});
|
||
|
|
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?1541153396801"></script>
|
||
|
|
<script src="./js/initPromise.js?1541153396801"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|