International Number Validation

R

Hello, people!

I’m from Brazil. I would like to suggest a validade Brazil’s phone number, because I can get to qualify my leads here (in Brazil).

10 replies

J

Hi Ricardo! Unfortunately at this time the only type of phone number validation Unbounce supports is to validate as a North American phone number. You could use custom Javascript to support the functionality you require, but this is a custom solution that requires the ability to write code.

We know that international phone number validation is an important feature for customers outside of North America, so I’ll be sure to update this thread with any progress we make on this issue. Thanks so much for taking the time to let us know your feature request Ricardo 🙂

Lars_Mathisen

Hi one thing is the validation, but even more important for us is that we can set up predefined structure (prefix) (phonenumber), is that possible?

J

Hi Lars! Setting up a predefined structure for phone number fields is not a native feature to the Unbounce forms at this time. This sort of structure could be possible with javascript, but this is a custom solution. Thanks for reaching out, and I’ll be sure to update this thread with any improvements we make on this issue.

Carter
Rank

Hey Ricardo and Lars,
We’ve added support for UK, Australian and Generic phone number validations in addition to North American like we’ve always had, hopefully this helps a little bit. You can see my detail response over here…

VictorAB

Guys, I'm having the same problem.

I'm from Brazil, and we're having problems with this number validation, because if I configure the phone number field as "generic", sometimes people fail to put numbers, making contact impossible (wrong number)

number format: (xx) xxxx-xxxx

If you can share a script that helps us with this problem, it would help, since we don't have this native option in Unbounce.

Oliver_Lord
Rank
Userlevel 4
Badge

Hey @VictorAB, Happy New Year to you!

Thanks for your post. Can I ask if you’ve checked out this excellent thread on custom validations?:

 

 

I am aware that they looked at scripts for certain countries’ telephone numbers, so maybe these could be manipulated to be more specific for Brazilian numbers.

 

Hope this helps - let us know if you need further help with this :-)

VictorAB

Hey @Oliver_Lord , happy new year to!

@Ricardo_Barbosa im got a solution, a developer friend made a script that worked very well for this need;

In the code below, just change the variable ’seu_telefone’ to the one in the "Field Name and ID"  from your phone number form field:

 

<script>
  const $input = document.getElementById('seu_telefone')
$input.addEventListener('input', handleInput, false)
function handleInput (e) {
  e.target.value = phoneMask(e.target.value)
}
function phoneMask (phone) {
  return phone.replace(/\D/g, '')
    .replace(/^(\d)/, '($1')
    .replace(/^(\(\d{2})(\d)/, '$1) $2')
    .replace(/(\d{4})(\d{1,5})/, '$1-$2')
    .replace(/(-\d{5})\d+?$/, '$1');
}
</script>

 

So the magic happens automatically applying a "mask" in your form field for telephone numbers (for numbers from Brazil containing the region code + 8 to 9 numbers that can be either landline or mobile).

Hope this helps too!

 
Kevin_Garneau
Rank
Userlevel 2
Badge

@VictorAB This is incredible thank you!

Oliver_Lord
Rank
Userlevel 4
Badge

Thanks for this @VictorAB . This could help out a lot of people 🎉😎

VictorAB

Hey guys, new code update!

With this one, it is MANDATORY to have between 8 and 9 numbers + the area code here in Brazil, example: (41) 9999-99999 or (41) 3333-3333.

Otherwise, an error message appears and the form is not sent, deleting the incorrect number from the field.

 

<script>
    const $input = document.getElementById('seu_telefone')
    $input.addEventListener('input', handleInput, false)
    $input.addEventListener('blur', handleBlur, false)
    $input.addEventListener('keypress', handleKeyPress, false)
    function handleInput (e) {
        e.target.value = phoneMask(e.target.value)
    }
    function handleBlur (e) {
        if(!phoneValid(e.target.value)) {
            e.target.value = ''
        }
    }
    function handleKeyPress(e) {
      if (event.key === "Enter" && !phoneValid(e.target.value)) {
        e.target.value = ''
      }
    }
    function phoneValid(phone) {
        return phone.match(/\([0-9]{2}\)[ ][0-9]{4,5}-[0-9]{4}/g)
    }
    function phoneMask (phone) {
      return phone.replace(/\D/g, '')
        .replace(/^(\d)/, '($1')
        .replace(/^(\(\d{2})(\d)/, '$1) $2')
        .replace(/(\d{1,5})(\d{4})/, '$1-$2')
        .replace(/(-\d{4})\d+?$/, '$1');
    }
</script>

 

Reply


Terms & ConditionsCookie settings