International Telephone Input
A JavaScript plugin for entering and validating international telephone numbers. It takes a regular input field, adds a searchable country dropdown, auto-detects the user's country, displays a relevant placeholder number, formats the number as you type, and provides comprehensive validation methods.
Requires JS.
assets/scss/vendors/intl/_intl.scss
assets/js/vendors/intl-tel.js
assets/js/vendors/intl-tel.js
Note that this component requires the use of the third-party
intl-tel-input
plugin.
Basic Demo
Input
Please enter Phone.
<div class="mb-3">
<label for="phone" class="form-label visually-hidden">Phone</label>
<input type="tel" name="phone" placeholder="" class="form-control w-100" required autocomplete="phone" id="phone" />
<div class="invalid-feedback">Please enter Phone.</div>
</div>