PLEASE NOTE: This guide requires some technical ability, a familiarity with HTML and Javascript. It is for front end templates and does not relate to back end validation.
If you want to validate your Phone field on the front end of your landing page?
Want to ensure the data is formatted correctly before the form can be submitted.?
Then this is for you!
The below code can simply be added to a Databowl form page.
It's important to note that this below example serves as a basic way of validating phone numbers and will allow certain number combinations through that aren't actually phone numbers.
Therefore, consider using a lookup API such as Combi Telephone - which includes a cost per phone lookup/validation - to ensure full accuracy of phone numbers and higher lead quality.
Getting Started
First thing you need to do is head to your landing page, and go to your Javascript.
This could either be on: site assets or the JS tab of your template or page.
Use the following code:
//do not change the regex variable unless you need to perform a different string comparison such as not UK phone numbers.
sb.Validation.addValidator('ukPhoneValidation', function(value) {
var regex = /^(((\+44\s?\d{4}|\(?0\d{4}\)?)\s?\d{3}\s?\d{3})|((\+44\s?\d{3}|\(?0\d{3}\)?)\s?\d{3}\s?\d{4})|((\+44\s?\d{2}|\(?0\d{2}\)?)\s?\d{4}\s?\d{4}))(\s?\#(\d{4}|\d{3}))?$/;
return regex.test(value);
});
//form = 'your form ID without a hashtag'
var form = 'form-1';
//'F_12_PHONE1' could vary per Databowl instance. Please be sure to refer to your integration document to grab the phone field you're working with. This will need to be uppercase within your JavaScript code.
sbf.forms[form].addValidator('F_12_PHONE1', 'ukPhoneValidation');
Adjust to your field
In our example this is our phone field we are validating
F_12_PHONE1
If your field has a different ID, then change this value in the above code to match your needs.
Wrapping Up
Now that's in place, you should test and ensure it's working as expected.
ALWAYS TEST.
And then you're set with some lovely front end phone validation 👍
🚀 Need More assistance?
If you're stuck or if this isn't something you or your team is comfortable with, then please open a new chat/ticket (chat icon in the bottom right of the screen) or email support@databowl.com.
We're here to assist with any questions you have, and if required we can quote on actioning work like this for as part of our Marketing Services.