Why does Phone # Input Mask change the field style

URL:

https://form.jotform.com/60193997255164

I want an input mask for the phone number section. When I push the input mask button, it shrinks the whole field down to one section, rather than the typical phone with area code separate from the other part. I just want people to not be able to type in random #'s, like they have been doing. 

Does the mask limit the amount of characters they can type in also. Also is there a way to make typing in the phone number more fluid so that when someone types in the area code, it intuitively goes to the next section?

Hi,

You can try using the Fixed Format Widget instead so that you can have separate fields for the area code and the phone number. 

http://widgets.jotform.com/widget/fixed_format 

With this widget, you can limit the amount of characters that a user types in and it automatically goes to the next field once the previous field has the correct input.

Here's a link to a sample form with a Fixed Format Widget: https://form.jotform.com/60197789913976 

Do inform us if you need further assistance,
Regards.