Handling Phone Number Inputs

Before submitting I’m checking for character length to validate it’s a valid number, but any advice on how I can make phone inputs look “prettier” - for example, in the US phone numbers are normally formatted as 123-456-7899 – is there anyway in Intuiface that I can have the dashes automatically inserted as the user types their number into a text field?

Hi Patrick,

There would multiple ways, based on triggers / actions, detecting the length of the entered text and replacing it on the fly within the text input.
The fastest way I could find is to make the actual input invisible and display a converted value on top of it.
See this project: PhoneNumberFormatting.zip (6.3 MB)

1 Like

I’m adding another version, the formatting isn’t done on the fly but upon submission.
Very similar to the previous one, may differ on the rendering as you can keep the Input Text design properties in edit mode.

Community-PhoneNumber-Mask.zip (6.0 MB)