CODEWITHSUNDEEP
javascriptreactjslibphonenumber
Ali Kleit
Ali Kleit

Reputation: 3649

Getting true valid number using asYouType in libphonenumber when its invalid

I'm using libphonenumber in react to format and validate phone number (Lebanese number in my case).

The valid mask of the Lebanese phone number is +961 xx xxx xxx and that's actually working well in the example given in their demo Here

so for Lebanon the country code is LB and valid template is xx xxx xxx

so for example When the input is +961 71 123 123 ==> phone number is actually valid and +961 71 123 12 is not

in my case in react the input number is valid once it reaches 2 as in 71 123 12 when it supposed to reach 3

import { AsYouType } from 'libphonenumber-js'

let asYouType = new AsYouType()

asYouType.defaultCountry = 'LB';
asYouType.reset();

asYouType.input('7112312')

// <<< PROBLEM HERE >>>
console.log('number is valid ',asYouType.getNumber().isValid()); 
//output: is valid when it should not be valid 71 123 12 (missing     one number)


asYouType.defaultCountry = 'LB';
asYouType.reset();
asYouType.input('711231') 
console.log('number is valid ',asYouType.getNumber().isValid()); 
// out : false (OK)

asYouType.defaultCountry = 'LB';
asYouType.reset();
asYouType.input('71123123') 
console.log('number is valid ',asYouType.getNumber().isValid()); 
// out: true (OK)

Upvotes: 1

Views: 3606

Answers (1)

Michael Schmid
Michael Schmid

Reputation: 5005

libphonenumber-js by default uses a reduced metadata set in order to reduce the package size. What you see might be a result of that simplification.

If you want to use the full metadata set, use the /max suffix when importing the library.

import { AsYouType } from 'libphonenumber-js/max'

Check the documentation for further information about the provided metadata sets.

Upvotes: 1

Related Questions