Phone number verification in html

Question

I have html code and it checks phone number keyed in is whether valid or not. I can't find how it check to validate the phone number.

The problem is it's validation doesn't allow + sign and start with 0. How can I allow + sign and start with 0 at phone number validation.

My html code is as follow.

<div class="form-group has-feedback">
  <div class="form-group" ng-class="{ 'has-error' : consumerRegisterForm.Office_no.$invalid && (consumerRegisterForm.Office_no.$dirty || submitted)}">
    <div class="input-icon">
      <i class="icon fa fa-phone-square"></i>
      <input type="number" class="form-control" ng-model="RegisterData.Office_no" name="Office_no" placeholder="Office Phone Number" ng-required="true">
    </div>
    <p class="validation-error" ng-show="consumerRegisterForm.Office_no.$error.required && (consumerRegisterForm.Office_no.$dirty || submitted)" class="help-block">Please Enter office phone number.</p>
  </div>
</div>

I can't find in my source code. It should have? But why I can't find the validation source. — batuman, Apr 28 '17 at 08:22
Yes, these validations are usually made in javascript. What framework do you use ? — Mojo Allmighty, Apr 28 '17 at 08:23
it is in AngularJS. What key word should I use to search? invalid and dirty? I used invalid and dirty, I can't find validation in controller js code. — batuman, Apr 28 '17 at 08:24
You can use `ng-pattern` to validate. More info here http://stackoverflow.com/questions/27986173/validate-phone-number-using-angular-js — Mojo Allmighty, Apr 28 '17 at 08:29
You could change the input type from `number` to `tel`. This way it gets validated as a phone number. — chillichief, Apr 28 '17 at 08:29
@chillichief so I can start with 0 and can include +? let me try. thanks — batuman, Apr 28 '17 at 08:30
Just to clarify: The input does not get validated by javaScript, but by the browser itself. check http://caniuse.com/#feat=input-email-tel-url so see which browser supports this — chillichief, Apr 28 '17 at 09:02

score 1 · Accepted Answer · answered Apr 28 '17 at 09:25

1

Your input is type="number". It means it only allows... numbers.

As you want to use + and leading zeros, you may want to change it to text:

<input type="text" .../>

answered Apr 28 '17 at 09:25

Mistalis

17,145
13
72
95

score 0 · Answer 2 · answered Apr 28 '17 at 11:53

0

Use input type "text" and make directive which will fulfill your requirements

answered Apr 28 '17 at 11:53

Ravi Ubana

377
6
26

Phone number verification in html

2 Answers2