Category / Section
How to Make Phone Number Field in Web Widget to Allow Only Numbers
Published:
Using the custom JS option, you can make the phone number field in the web widget to allow only numbers.
Follow the given steps:
- Go to the Admin module.
- Select the Web Widgets.
- Click the active Web Widgets to allow only numbers.
- Navigate to Advanced Customization.
- Paste the following custom JS code.
Custom JS code
inputField = document.querySelector('.phone-number-field');
inputField.addEventListener('keypress', function(event) {
const regex = /[\d\+]/;
if (!regex.test(event.key)) {
event.preventDefault();
}
});
- Click on Update.
Note: This regex will only allow numbers and “+” symbol. You can use the regex according to your needs.
The picture below illustrates how to paste the custom JS code.