Initialisation promise
When you initialise International Telephone Input with one of the asynchronous initialisation options (like loadUtils
or geoIpLookup
), a JavaScript Promise is returned as a property of the instance object e.g. in the example below, this can be acccessed as iti.promise
. This Promise will be resolved when the asynchronous actions have been completed e.g. the utils script has been loaded in the case of loadUtils
, and/or the IP lookup has completed in the case of geoIpLookup
. This is useful if you want to do something as soon as the initialisation is complete. Perhaps you want to show a loading state while the IP lookup is happening, and then hide it once the initial country has been set.
Demo
Status: Initialising...
Markup
<p>
Status:
<span id="status">Initialising...</span>
</p>
<input id="phone" type="tel" />
Code
const input = document.querySelector("#phone");
const statusElement = document.querySelector("#status");
const iti = window.intlTelInput(input, {
initialCountry: "us",
loadUtils: () => import("/intl-tel-input/js/utils.js?1733756310855"),
});
iti.promise.then(() => {
statusElement.innerHTML = "Initialised!";
});