How to add validation for phone number in a text box.

I need to add validation for phone number in a text box. When user enters incorrect phone number it will give a proper error message to user. can someone please suggest me code for this.

Hi Pratik,

 You can use regax function for check mobile number and set this length is 10.

and add jquery code which restrict use insert only number in textbox.

below is the function which allow only interger accept in text boc.

function isNumber(evt, element) {

    var charCode = (evt.which) ? evt.which : event.keyCode

    if (
        (charCode != 45 || $(element).val().indexOf('-') != -1) &&      // “-” CHECK MINUS, AND ONLY ONE.
        (charCode != 46 || $(element).val().indexOf('.') != -1) &&      // “.” CHECK DOT, AND ONLY ONE.
        (charCode < 48 || charCode > 57))
        return false;

    return true;
}


Thanks 

Rahul Sahu

https://www.outsystems.com/forge/component/621/jqueryinputmask/

https://www.outsystems.com/forge/component/1002/restrictchars/

https://www.outsystems.com/forge/component/274/input-masks/


Here you can find some components from the forge which you can use in order to only allow numbers. 

And indeed use Regex for validation, I don't know what kind of numbers you want to validate, so it is hard to give you a good Regex example

Hi Pratik,

Can you tell me which phone number formats should be allowed?

Kind regards,
Glenn

glenn michiels wrote:

Hi Pratik,

Can you tell me which phone number formats should be allowed?

Kind regards,
Glenn

It should be any international phone number, as some countries have 9 digits phone number while some have 10, so it would validate both. Thanks a lot.

Pratik Raj wrote:

glenn michiels wrote:

Hi Pratik,

Can you tell me which phone number formats should be allowed?

Kind regards,
Glenn

It should be any international phone number, as some countries have 9 digits phone number while some have 10, so it would validate both. Thanks a lot.


/0\d?\d{9,10}/g This Regex should work I guess. You can play with it here: 

https://regex101.com/r/gY0mC3/1

Pratik Raj wrote:

glenn michiels wrote:

Hi Pratik,

Can you tell me which phone number formats should be allowed?

Kind regards,
Glenn

It should be any international phone number, as some countries have 9 digits phone number while some have 10, so it would validate both. Thanks a lot.

Hi Pratik,

The following regex should work for your requirements then.

(([+][(]?[0-9]{1,3}[)]?)|([(]?[0-9]{4}[)]?))\s*[)]?[-\s\.]?[(]?[0-9]{1,3}[)]?([-\s\.]?[0-9]{3})([-\s\.]?[0-9]{3,4})

You can try it out here to double-check as well: https://regexr.com/

Kind regards,
Glenn


Think it's better to use one of the components Martin Rozeboom mentioned; these wil do the check client side, and are much easier to maintain (more low code way of implementing it). See example below with CustomMasks component.

Happy Low-Coding!

Matthias

The maskdefinition for your phone number would be "9{9,10}"

Matthias Preuter wrote:

Think it's better to use one of the components Martin Rozeboom mentioned; these wil do the check client side, and are much easier to maintain (more low code way of implementing it). See example below with CustomMasks component.

Happy Low-Coding!

Matthias


Thanks Matthias, as I am new to outsystems, which plugin to download for this CustomMasks/ MasksText. That would be great help. Thanks a lot.

You can find the component I used Here

You can use this Forge component if you accept phone from different countries:

https://www.outsystems.com/forge/component-overview/4670/international-dial-code-input-with-country-flags 


Cool, didn't know that one!

Hi everyone!


For future proofing, I found out that we can have different maximum number of digits for the different parts of a telephone number according to this recommendation.

https://en.wikipedia.org/wiki/E.164

Kind regards,
Joseph Enriquez

Matthias Preuter wrote:

You can find the component I used Here

unfortunately, we don't have a react one yet for this


Maybe this component will help, didn't try yet but it's Reactive  one

https://www.outsystems.com/forge/component-overview/2258/input-masks-library

Matthias Preuter wrote:

Maybe this component will help, didn't try yet but it's Reactive  one

https://www.outsystems.com/forge/component-overview/2258/input-masks-library

Sorry I haven't made myself clear. It has things for Credit Card, Currency and Number. I tried it a bit but it really doesn't have a thing for Phone Number (+1 (xxx) xxx-xxxx) unless I guess you tweak it. I also have a use case for Social Security Number (USA).