catamphetamine / react-phone-number-input

React component for international phone number input

Home Page:http://catamphetamine.gitlab.io/react-phone-number-input/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

any way to provide the default or initial value while able to hide the country code.

visibleajay opened this issue · comments

What?

We are using PhoneInput with formik, though we are able to access the phone number, we are storing it without country code. While editing the field we again need to pass it back to PhoneInput. Is their any way to pass phone number without country code and still able enjoy the formatting of PhobeInput.

Not clear what you mean.
Provide screenshots or something.

Sharing screenshot.

Screenshot1:- Display a card with normal phone number.
screenshot1

Screenshot2:- On editing the same card, a modal is opened with already filled information. Number contains a country code which we wants to remove.
screenshot2

Screenshot3:- On a single backspace, the number gets correctly formatted.
screenshot3

<PhoneInput
          {...rest}
          name={name}
          defaultCountry="US"
          displayInitialValueAsLocalNumber={true}
          international={false}
          className={'form-control'}
          placeholder={label}
          onChange={(phone, country) => {phone && onPhoneChange(phone)}}
 />
<TextInput
      isPhone
      label="Contact Number"
      name="contactNumber"
      onPhoneChange={(phone) => setFieldValue("contactNumber", phone)}
      value={phone}
 />

Before submission to backend,

const useMe = contactNumber.substring(2);

Before using it again.

const phone = "+1" + useMe;

Please let me know if any more information is needed.

Display a card with normal phone number.

What's a "normal" phone number.
There's no such thing.

Please let me know if any more information is needed.

It's not clear what exactly you want.