ipinfo all

by John Doe

HTML

<script src="cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.0.3/js/intlTelInput.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.0.3/js/utils.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/intl-tel-input/6.4.1/css/intlTelInput.css">

<div id="ip"></div>
<div id="address"></div>
<hr/>Full response: <pre id="details"></pre>

 <input id="customerphone" type="tel">
 <input id="city" name="city" type="text" class="required" title="This is a required field">
 
  <select id="country" name="country" class="required selectpicker" title="This is a required field">
                    <option value="">select an option</option>
                    <option value="NZ">New Zealand</option>
                    <option value="AU">Australia</option>
                    <option value="UK">United Kingdom</option>
                    <option value="US">United States</option>
                    <option value="CA">Canada</option>
                    <option value="FR">France</option>
                    <option value="ZW">Zimbabwe</option>
              </select>

JavaScript

// https://github.com/jackocnr/intl-tel-input	
$("#customerphone").intlTelInput({
	
	 allowDropdown: true,
      //autoHideDialCode: false,
      preferredCountries: ['nz', 'au', 'us', 'gb', 'de', 'cn'],
      //separateDialCode: true,
	  
  initialCountry: "auto",
  geoIpLookup: function(callback) {
    $.get('//ipinfo.io', function() {}, "jsonp").always(function(resp) {
      var countryCode = (resp && resp.country) ? resp.country : "";
	    callback(countryCode);
	  
	  
	  $("#ip").html("IP: " + resp.ip);
	  $("#city").html("Location: " + resp.city + ", " + resp.region);
	  $("#country").append($("<option></option>").attr("value", country.iso2).text(country.name));
	  
	  
    $("#details").html(JSON.stringify(resp, null, 4));
	
	  //var countryData = jQuery("#phone").intlTelInput("getSelectedCountryData");
	   //console.log(resp.city, resp.country);
    });
  },
  

});