Add Mask to phone number fields in app

Prevents  1 and 0 from starting a phone number.
This commit is contained in:
Bill Richardson 2024-02-16 16:19:47 -05:00
parent 47a2a10e84
commit d85829f83e
3 changed files with 33 additions and 2 deletions

View file

@ -39,7 +39,7 @@
inputId="phoneNumberField"
cmsWidgetName="PhoneNumberQuestion"
isRequired
mask="###-###-####"
:mask="mask"
disableAutoFill
:validationRules="rules.phoneNumber" />
<textboxQuestion
@ -175,6 +175,16 @@ export default {
},
canNavigateBack() {
return canNavigateBackFromBailout();
},
mask() {
return {
mask: 'x##-###-####',
tokens: {
x: {
pattern: /[2-9]/
}
}
};
}
},
methods: {

View file

@ -46,6 +46,7 @@
inputId="phoneNumber"
:cmsWidgetName="widget.phoneNumberQuestion"
isRequired
:mask="mask"
:validationRules="rules.phoneNumber" />
<checkbox
ref="requestTextUpdatesCheckbox"
@ -179,6 +180,16 @@ export default {
*/
textUpdateDisclaimerText() {
return `*${this.getCmsContent(this.widget.disclaimer, 'Text')}`;
},
mask() {
return {
mask: 'x##-###-####',
tokens: {
x: {
pattern: /[2-9]/
}
}
};
}
},
methods:

View file

@ -38,7 +38,7 @@
inputId="phoneNumber"
:cmsWidgetName="widget.phoneNumberQuestion"
isRequired
mask="###-###-####"
:mask="mask"
disableAutoFill
:validationRules="rules.phoneNumber" />
</template>
@ -101,6 +101,16 @@ export default {
},
footerButtonText() {
return this.getCmsContent(this.widget.drawerFooter, widgetFields.FOOTER_WIDGET.FORWARD_BUTTON_TEXT);
},
mask() {
return {
mask: 'x##-###-####',
tokens: {
x: {
pattern: /[2-9]/
}
}
};
}
},
methods: {