How do I automatically validate and format USA phone numbers on user input?

Digioh App Marketplace

If you want to validate or format a USA phone number, there’s an app for that named Phone Validation App.

The main features of the app:

  • The app will validate that the number is a syntactically valid phone number.
  • Optionally enable auto addition of the “+” icon and “1” digit at the start of the phone number like this (+12434567890).
  • Format phone number in this format “xxx-xxx-xxxx”

Valid phone numbers:

(xxx) xxx-xxxx +1xxxxxxxxx (xxx)xxx-xxxx

Installation:

Step 1: From the profile menu top right click on “Custom Javascript (Apps)”

Step 2: Install the “Phone Validation App” app one time. All your boxes can now use the feature.

Step 3: For activating the app feature, select the specific phone number field in the Box Editor, and at the bottom of the screen enter the metadata fields that are listed in the below table.

Metadata Field Value Description Required/Optional
phone_validate_usa true Enable USA phone number validation Required
phone_add_plus_one true/false Add +1 at the start of the phone no (+12345678901) automatically Optional

Formatting Phone Numbers

If you want to format phone numbers like the below image. You can have form input fields automatically format as phone numbers so that it’s impossible for a user to enter a syntactically invalid phone number.

The input field rejects any input, not a number, and automatically adds dashes to standardize.

To activate, select the specific phone number field in the Box Editor, and at the bottom of the screen enter the metadata key “phone_format_usa”, with the value “true”. The field must be of type Text or be the built-in Phone field.

Running into an issue or have a question? Reach out to our support team via support@digioh.com and we’ll be happy to help!