Phone Number Validation and Mask

Hello everyone,
​
First time using CFv6! In v5 I always added the following mask for phone number fields:

data-inputmask='mask' : '999-999-9999'
type=tel

To validate I would make the field required and checked phone number in the validation tab.
​
I found a thread with a CFv6 phone mask so I changed the code to mirror that with the colon instead of equal sign:

data-inputmask:'mask' : '999-999-9999'
type=tel

The mask does display ok, but it's not working correctly, as follows:
​
- The field loses it's formatting on the front end and becomes at small box
- Turning on phone number makes the field impossible to submit (I suspect because phone is tied to the mask integrated in the form, which has 1+ before the number (we don't use that format here in the US)
- The type=tel which tells mobile devices to bring up the number keypad doesn't work
​
Here's a link to the form: http://cslftlauderdale.org/new/contact
​
Thanks in advance for your help!
​
Jose
​
EDIT: Not sure how I tagged Connectivity. This post is for Chronoforms v6

If you're using a custom mask, don't turn on any "mask" option in the validation tab.

No mask options are turned on. The mask is off because the CF mask option requires the phone number to be entered as +9(999)-9999. We don't use that phone format in the US.

type=tel should also be type:tel

Thanks, that fixed the display issue. But the field can still be submitted without entering a full phone number. How do I set up validation so that a full number that looks like 555-555-1212 is entered? Right now, someone can enter 555-___-____ and the form will still submit.
​
Thanks
​
Jose

Use regex. Busy now can't make the pattern for you

No idea what is regex...