Adding Country Code with Country Name in Phone number field

[moiz_striker]

Hi There!

I am new on webflow, I want to add country code with country name in mobile number field in a appointment form, so can anyone help me that how we can do this in webflow???

[memetican (Michael Wells)]

International Phone Numbers | Webflow Forms | Sygnal-U

[moiz_striker]

Thanks for the reply but the thing is I have tried it out before and it worked but the problem is I need country name with flag and in this example, just flag appears, country name shows in the dropdown

[memetican (Michael Wells)]

You’d need to adapt it to add that small display element for the selected item. To be honest, I’m not sure how that would look, some country names are quite long. Perhaps display it below the phone input element?

I do dev work, so feel free to message me if you need some coding work done.

[moiz_striker]

Yeah I would love to, if you solve my problem. This is the page below there is a section with the name schedule and appointment, and in this section I have a form and there I need that country name with flag in number field.
(For Doctors)

[gerymu09 (Marcos Molina)]

Hi, I have tried the solution @memetican suggested and it simply does not work for me. The published form telephone section looks all out of wack (see screenshot below).

I created the form as done by Oz Hashimoto and added the scripts in the and sections (see screenshots), but it is still not working. Can someone help me here? Am I missing something?

[memetican (Michael Wells)]

Oz’s cloneable has some CSS code you need in the head custom code area as well;

<link href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.12/css/intlTelInput.min.css" rel="stylesheet"/>

<style>
.hide {
		display: none;
}
#valid-msg {
    color: #10B981;
}
#error-msg {
		color: #F43F5E;
}
</style>