Expand my Community achievements bar.

SOLVED

Format phone numbers

Avatar

Level 2

I'm looking to format phone numbers in a text field to xxx-xxx-xxxx, when you tab out of the field. I have users that enter phone numbers many ways 6052222222,605-222-2222,605.222.2222

I Have (this.value = this.value.replace(/[^\*]/g,'*')"/>) on my exit on the field which works fine if your enter the phone number 6052222222. Any direction in the right way would be great, a newbie to this

Thanks,

1 Accepted Solution

Avatar

Correct answer by
Level 10

As Jono Moore mentioned you can control the display using the patterns.

Display Pattern: text{999-999-9999}

Edit Pattern: text{9999999999}|text{999.999.9999}|text{999-999-9999}

But when you want to store the data to DB, the text field will store only the numbers without the formatting. So when you want to display the phone number from the database, the field will know how to format it back to xxx-xxx-xxxx.

Workaround:

But if your intention is to store the phone number as xxx-xxx-xxxx into the DB, then place a hidden field on the form and bind that field to your DB field

On the exit event of the phone number field assign the formatted value to the hidden field.

Donot put any pattern on the hidden field.

Insted of storing the data from the phone number field, store the value of the hidden field to your database.

In the exit event of the phone number field write:

HiddenField.rawValue = PhoneNumberField.formattedValue;

Thanks

Srini

View solution in original post

6 Replies

Avatar

Level 10

Have you tried using the field patterns? You can do most of this with patterns.

Set the Display pattern to "text{999-999-9999}" and you can add all the variations you want for entering phone numbers in the Edit patterns.

Avatar

Level 2

Yes i messed around with the display pattern, problem I'm running into is it doesn't return the correct format to the DB.

Avatar

Level 10

I haven't really done anything with databases but you've set the Data pattern as well? That's supposed to control how the data looks on export.

Avatar

Level 2

yes i set the Data pattern as well still not correct. Just looking for some other options

Avatar

Correct answer by
Level 10

As Jono Moore mentioned you can control the display using the patterns.

Display Pattern: text{999-999-9999}

Edit Pattern: text{9999999999}|text{999.999.9999}|text{999-999-9999}

But when you want to store the data to DB, the text field will store only the numbers without the formatting. So when you want to display the phone number from the database, the field will know how to format it back to xxx-xxx-xxxx.

Workaround:

But if your intention is to store the phone number as xxx-xxx-xxxx into the DB, then place a hidden field on the form and bind that field to your DB field

On the exit event of the phone number field assign the formatted value to the hidden field.

Donot put any pattern on the hidden field.

Insted of storing the data from the phone number field, store the value of the hidden field to your database.

In the exit event of the phone number field write:

HiddenField.rawValue = PhoneNumberField.formattedValue;

Thanks

Srini