catamphetamine / react-phone-number-input

React component for international phone number input
http://catamphetamine.gitlab.io/react-phone-number-input/
MIT License
927 stars 194 forks source link

Validation: 11 digit Indian number validates to true #70

Closed grahamlutz closed 7 years ago

grahamlutz commented 7 years ago

It looks like the validation for Indian numbers continues to validate numbers with between 11-14 numbers. The following screen shot is with a valid Indian number:

screen shot 2017-09-06 at 12 54 50 pm

The following is with an 11 digit (invalid) Indian phone number, which still has isValid: true

screen shot 2017-09-06 at 12 55 21 pm

Then the following is the same situation for US numbers. First screenshot is a valid number with 10 digits with isValid: true and the second is an invalid number with 11 digits and isValid: false

screen shot 2017-09-06 at 12 56 39 pm

screen shot 2017-09-06 at 12 56 47 pm

catamphetamine commented 7 years ago

What's your exact question?

grahamlutz commented 7 years ago

Shouldn't 11 digit (not including country code) Indian numbers return isValid: false?

catamphetamine commented 7 years ago

I dunno. What does the google demo say.

catamphetamine commented 7 years ago

Oh, I get it, once again, a bug report for another repo. I'm gonna add this to the readme. In a minute.

catamphetamine commented 7 years ago

See the updated readme:

https://github.com/catamphetamine/react-phone-number-input#bug-reporting

grahamlutz commented 7 years ago

It looks like google's result from isValidNumber() is false.

screen shot 2017-09-06 at 1 41 48 pm

catamphetamine commented 7 years ago

Ok, then the next step would be using the full metadata in the React component

<PhoneInput metadata={require('libphonenumber-js/metadata.full.json')}/>
grahamlutz commented 7 years ago

Got it, Thanks!

grahamlutz commented 7 years ago

So I've got that in place, and it's pulling it in but does't change anything. This is what the props on our phone component looks like:

screen shot 2017-09-06 at 2 42 09 pm

And this is what I am using to validate:

handleBlur = (e) => {
    let phone = e.target.value;

    if (!isValidPhoneNumber(phone) && phone != "") {
      this.setState({isValid: false});
    }
    else {
      this.setState({isValid: true});
    }
};

Any other thoughts?

catamphetamine commented 7 years ago

Oh, man, I mislead you a bit on this one. Actually, use 'isValidNumberCustom' with the full metadata as described in 'libphonenumber-js' readme.

On Wed, 6 Sep 2017 at 21:44, Graham Lutz notifications@github.com wrote:

So I've got that in place, and it's pulling it in but does't change anything. This is what the props on our phone component looks like:

[image: screen shot 2017-09-06 at 2 42 09 pm] https://user-images.githubusercontent.com/12991947/30128748-c6b7fd82-9311-11e7-96c5-db073d214c2c.png

And this is what I am using to validate:

handleBlur = (e) => { let phone = e.target.value;

if (!isValidPhoneNumber(phone) && phone != "") {
  this.setState({isValid: false});
}
else {
  this.setState({isValid: true});
}

};

Any other thoughts?

— You are receiving this because you modified the open/close state.

Reply to this email directly, view it on GitHub https://github.com/catamphetamine/react-phone-number-input/issues/70#issuecomment-327577523, or mute the thread https://github.com/notifications/unsubscribe-auth/AAdH7yTnoBEFBp65ad0bj6P6YV1keyQAks5sfugYgaJpZM4POruA .