jackocnr / intl-tel-input

A JavaScript plugin for entering and validating international telephone numbers. Now includes React and Vue components.
https://intl-tel-input.com
MIT License
7.58k stars 1.94k forks source link

Phone number showing placeholder text instead of value #1803

Closed jaggaer-epastoor closed 2 days ago

jaggaer-epastoor commented 2 days ago

Plugin version

v24.5.0

Steps to reproduce

  1. I have reproduced this on React Storyboard in demo mode: Initial value example
  2. Enter in phone number: +375152450911
  3. See that displayed value is: 8 0152 45-09-11

Expected behaviour

Actual number should be displayed

Actual behaviour

Placeholder value is displayed but in the inspector the 'value' attribute is correct When form is submitted, the real value is submitted and not the placeholder value

Initialisation options

formatOnDisplay = true (default); however, turning this off fixes the value or: separateDialCode = true also fixes the issue

jackocnr commented 2 days ago

This is working as intended.

By default nationalMode is enabled, which means we format the number in national format, which is "8 0152 45-09-11". If, for some reason you want to show the number in international format, you can set nationalMode to false.

jaggaer-epastoor commented 2 days ago

The number +375152450911 in national mode happens to match the placeholder text 8 0152 45-09-11. Makes sense. Thank you. I'll turn nationalMode off

image

jackocnr commented 1 day ago

👍🏻

Btw the placeholder number for that country is very similar, but not the same.

Placeholder: "8 029 491-19-11" Your number: "8 0152 45-09-11"