Hi itsme,
Use GoogleAPI to get the result.
HTML
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&key=API_Key"></script>
<script type="text/javascript">
function GetDetails() {
var geocoder = new google.maps.Geocoder();
var postalCode = document.getElementById("txtPostalCode").value;
geocoder.geocode({ 'address': postalCode }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var address = results[0].formatted_address;
var pin = results[0].address_components[results[0].address_components.length - 1].long_name;
var country = results[0].address_components[results[0].address_components.length - 2].long_name;
var state = results[0].address_components[results[0].address_components.length - 3].long_name;
var city = results[0].address_components[results[0].address_components.length - 4].long_name;
document.getElementById('txtCountry').value = country;
document.getElementById('txtState').value = state;
document.getElementById('txtCity').value = city;
}
});
};
</script>
<input name="txtPostalCode" type="text" id="txtPostalCode" />
<input type="button" value="Get Details" onclick="GetDetails();" />
<br />
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>Country:</td>
<td><input type="text" id="txtCountry" /></td>
</tr>
<tr>
<td>State:</td>
<td><input type="text" id="txtState" /></td>
</tr>
<tr>
<td>City:</td>
<td><input type="text" id="txtCity" /></td>
</tr>
</table>