Articles in this section
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:

  1. Go to the Admin module.
  2. Select the Web Widgets.
  3. Click the active Web Widgets to allow only numbers.
  4. Navigate to Advanced Customization.
  5. 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();
      }
});
  1. 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.

Widget_Custom_JS.png

Was this article useful?
Like
Dislike
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied