Insert country code to phone input field with jQuery

Question

In a "contact us" form, I need to insert a country code (ie 972, 1, 91) to the phone input field after choosing the country from the select list. For example; If a user chooses "US" from the list, than the phone input field will start with the number "1" and than the user will continue to write his number. How do I do that with jQuery?

Thank you

Answer 1

You can do this buy adding the value as code of the Country like for US the value of option should be 1

Your HTML should be,

<select id="country">
   <option value="">Select Country</option>
   <option value="1">US</select>
   <option value="91">IN</select>
</select><br/>
Code: <input type="text" id="code" />

Jquery

$(function(){
   $('#country').on('change',function(){
       $('#code').val(this.value);// changing the code textbox value by current country value
   });
});

Answer 2

HTML:

<select id="country">
    <option value="">Select Country</option>
    <option value="1">US</option>
    <option value="+44 ">UK</option>
</select>
<input id="phone" type="text" name="phone">

jQuery:

$(function() {
    $('#country').on('change', function() {
        $('#phone').val($(this).val());
    });
});

Answer 3

<select id="country">
   <option value="">Select Country</option>
   <option value="1">US</option>
   <option value="91">IN</option>
   </select>
<br><br>
Code: <input type="text" id="code" />

$(function() {
    $('#country').on('change', function() {
        $('#phone').val($(this).val());
    });
});`enter code here`