Phone Number
Use this pattern when you need to ask users for their phone number.
Example
+855
<div class="cgds form-group">
<label class="form-label" for="phone">Phone Number</label>
<div class="input-group">
<span class="input-group-text">+855</span>
<input class="form-control" type="tel" id="phone" autocomplete="tel-local" pattern="[0-9]" maxlength="9" />
</div>
</div>
Usability guidelines
Explain the rationale of requesting for users' phone number.
This allows users to:
- Feel assured that their phone number will not be misappropriated.
- Choose which phone number they prefer to use.
Make sure it works for all users
- Your text field should accommodate only numbers and eight or nine characters.
- Set the
autocompleteattribute totel-localso that browsers can fill in their phone number if they have entered in previously.
