How to dynamically get the country code based on selected country

Question

Here is the piece of code that i am using. I have to show the country code automatically based on selected country by the user.

I have a database which has both, the countries and corresponding country code.

Now in the line where currently I am showing +91 how can i put the logic to do the same ?

Here is the code --

<div class="phone-number-verify-widget">
  <p class="pnaw-verification-error"></p>
  <div class="pnaw-step1">
    <div class="phone-number-input-widget" id="phone-number-input-widget-d04854e1">
  <label for="phone_country">Choose a country:</label>
  <div class="select">
    <select id="phone_country" name="phone_country">
        <option value="AF" data-prefix="93">Afghanistan</option>
        <option value="AD" data-prefix="376">....
        <option value="ZW" data-prefix="263">Zimbabwe</option>
    </select>
  </div>

  <label for="phone_number">Add a phone number:</label>
  <div class="pniw-number-container clearfix">
    **<div class="pniw-number-prefix">+91</div>**
    <input type="text" class="pniw-number" id="phone_number">
  </div>
  <input type="hidden" data-role="phone_number" name="phone" value="91">
  <input type="hidden" name="user_id" value="19935817">
</div>

Kindly guide.

Use AJAX. 1)When selecting a country, Value say for Ahganisthan AF will get. 2)Select the corresponding code from the database. — arunrc, Aug 26 '14 at 10:50
If you do not know PHP (guessing), you can use JavaScript to load in the relevant country if you have your db converted to a JS object. — Kohjah Breese, Aug 26 '14 at 10:51

score 0 · Answer 1 · answered Aug 26 '14 at 10:52

Since I don't know your codebase I roughly describe what I would do:

Get jQuery
Write an event listener on the change event of #phone_country
do an ajax call to a simple phpscript which queries the database providing me data i want
Update the field with the retrieved data

score 0 · Answer 2 · answered Aug 26 '14 at 11:07

0

Create an array of countries or fetch from your database if you have a countries master. You will get a result of countries in a array. Then make your country selection dynamic.

answered Aug 26 '14 at 11:07

rahul

776
5
30

I do have countries master in my database which has both country name and code. I am not understanding how to get do is. I know hot fetch the values of country and code from the DB but thn I get stuck with html – Newibe Aug 26 '14 at 11:15
Post your array of countries then i will see how can i help. – rahul Aug 26 '14 at 11:16
array looks like - [array](http://pastebin.com/iK59HPSC) – Newibe Aug 26 '14 at 11:24

score 0 · Answer 3 · answered Aug 26 '14 at 11:24

0

<?php

    $countries = array(array('Country'=>'India','CountryCode'=>'IN'),array('Country'=>'US','CountryCode'=>'US'),array('Country'=>'United Kingdom','CountryCode'=>'UK'));
    $selcountry = 'US';
    if(count($countries) > 0)
    {
        for($i=0;$i<count($countries);$i++)
        {
            $longname[$i] = $countries[$i]['Country'];
            $shortname[$i] = $countries[$i]['CountryCode'];
        }
    }
    $countrycombo = '';
    $countrycombo = '<select>';
    for($i=0;$i<count($shortname);$i++) 
    {
        if (trim($selcountry)==trim($shortname[$i])) 
        {
            $countrycombo .= "<option value='".$shortname[$i]."' selected>".$longname[$i]." (".$shortname[$i].") </option>";
        } 
        else 
        {
            $countrycombo .= "<option value='".$shortname[$i]."'>".$longname[$i]." (".$shortname[$i].") </option>";
        }
    }
    $countrycombo .= '</select>';
    echo $countrycombo;
?>

answered Aug 26 '14 at 11:24

rahul

776
5
30

You can ask me for help :) – rahul Aug 26 '14 at 11:25
I guess you didnt understand my question I have a dropdwon of country .. Now when user, say, selects INDIA then in the phone number 91 should come automatically. – Newibe Aug 26 '14 at 11:28
Then you need a field in your database to reffer the code. – rahul Aug 26 '14 at 11:31
i do have the code field – Newibe Aug 26 '14 at 11:38
Then you have to make a ajax call on change of dropdown, passing the selected value of country dropdown you can retrieve the isd code and show at the place of +91 – rahul Aug 26 '14 at 11:41

rahul · Accepted Answer · 2014-08-26T12:46:18.810

1)        <script src="jquery-1.11.1.js"></script>
    //--------------------------------------------------download jquery 
        <div class="phone-number-verify-widget">
          <p class="pnaw-verification-error"></p>
          <div class="pnaw-step1">
            <div class="phone-number-input-widget" id="phone-number-input-widget-d04854e1">
          <label for="phone_country">Choose a country:</label>
          <div class="select">
            <select id="phone_country" name="phone_country">
                <option value="AF" data-prefix="93">Afghanistan</option>
                <option value="AD" data-prefix="376">....
                <option value="ZW" data-prefix="263">Zimbabwe</option>
            </select>
          </div>
          <label for="phone_number">Add a phone number:</label>
          <div class="pniw-number-container clearfix">
            **<div class="pniw-number-prefix">+91</div>**
            <input type="text" class="pniw-number" id="phone_number">
          </div>
          <input type="hidden" data-role="phone_number" name="phone" value="91">
          <input type="hidden" name="user_id" value="19935817">
        </div>
        <script>
            $('#phone_country').change(function(){
                var country = $('#phone_country').val();
                $.ajax({
                    url: "result.php",//place your url of php file
                    type: "Post",
                    data: {country : country},// this post value used to match the data from database
                    success: function (data) {
                        $('.pniw-number-prefix').html(data);
                    },
                    error: function(xhr, status, err) {
                        alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
                        alert("responseText: " + xhr.responseText);
                    }
                });
            });
        </script>

2) Result.php file as i used in my code
<?php
$cc = $_POST['country'];
//using the $cc feth the code from database
// your query...............
// just to show the value i have assuming $isd value as 41
$isd = '41';    
echo $isd;
exit;
?>

Here you have used POST to get the country selected .. but this can't be done until and unless user dont click the submit button.. and here in between submit button cant be used. So how do I handle this ? — Newibe, Aug 26 '14 at 12:18
this is on ajax and the call works on change of dropdown value as you select other value. Try it — rahul, Aug 26 '14 at 12:49

How to dynamically get the country code based on selected country

4 Answers4