<html>
<head>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&key=Your API Key"></script>
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', function () {
var places = new google.maps.places.Autocomplete(document.getElementById('Address'));
getLatLong(places);
});
function placeLastOfFocus()
{
// alert(1);
// alert(places);
//document.getElementById('Address').value
//!a.trim()
if (!document.getElementById('Address').value.trim()) {
$("#Address1").val('');
$("#latitude").val('');
$("#longitude").val('');
return;
}
//doGeocode();
var places = new google.maps.places.Autocomplete(document.getElementById('Address'));
getLatLong(places);
}
function doGeocode() {
var addr = document.getElementById("Address");
// Get geocoder instance
var geocoder = new google.maps.Geocoder();
// Geocode the address
geocoder.geocode({ 'address': addr.value }, function (results, status) {
if (status === google.maps.GeocoderStatus.OK && results.length > 0) {
// set it ot he correct, formatted address if it's vadlid
addr.value = results[0].formatted_address;;
alert("valid");
// show an error if it's not
} else alert("Invalid address");
});
};
function getLatLong(places)
{
google.maps.event.addListener(places, 'place_changed', function () {
$("#Address").val('');
$("#latitude").val('');
$("#longitude").val('');
//alert(1);
var place = places.getPlace();
var address = place.formatted_address;
var latitude = place.geometry.location.lat();
var longitude = place.geometry.location.lng();
//var city = place.geometry.location.city();
//alert(address);
//for testing purpose alert
var mesg = "Address: " + address;
mesg += "\nLatitude: " + latitude;
mesg += "\nLongitude: " + longitude;
//alert(mesg);
$("#Address1").val(address);
$("#latitude").val(latitude);
$("#longitude").val(longitude);
});
}
</script>
</head>
<body>
<textarea name="Address" id="Address" autocomplete="on" class="col-lg-offset-5" ></textarea>
<input type="text" name="latitude" id="latitude" autocomplete="on" />
<input type="text" name="longitude" id="longitude" autocomplete="on" />
</body>
</html>
<head>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&key=Your API Key"></script>
<script type="text/javascript">
google.maps.event.addDomListener(window, 'load', function () {
var places = new google.maps.places.Autocomplete(document.getElementById('Address'));
getLatLong(places);
});
function placeLastOfFocus()
{
// alert(1);
// alert(places);
//document.getElementById('Address').value
//!a.trim()
if (!document.getElementById('Address').value.trim()) {
$("#Address1").val('');
$("#latitude").val('');
$("#longitude").val('');
return;
}
//doGeocode();
var places = new google.maps.places.Autocomplete(document.getElementById('Address'));
getLatLong(places);
}
function doGeocode() {
var addr = document.getElementById("Address");
// Get geocoder instance
var geocoder = new google.maps.Geocoder();
// Geocode the address
geocoder.geocode({ 'address': addr.value }, function (results, status) {
if (status === google.maps.GeocoderStatus.OK && results.length > 0) {
// set it ot he correct, formatted address if it's vadlid
addr.value = results[0].formatted_address;;
alert("valid");
// show an error if it's not
} else alert("Invalid address");
});
};
function getLatLong(places)
{
google.maps.event.addListener(places, 'place_changed', function () {
$("#Address").val('');
$("#latitude").val('');
$("#longitude").val('');
//alert(1);
var place = places.getPlace();
var address = place.formatted_address;
var latitude = place.geometry.location.lat();
var longitude = place.geometry.location.lng();
//var city = place.geometry.location.city();
//alert(address);
//for testing purpose alert
var mesg = "Address: " + address;
mesg += "\nLatitude: " + latitude;
mesg += "\nLongitude: " + longitude;
//alert(mesg);
$("#Address1").val(address);
$("#latitude").val(latitude);
$("#longitude").val(longitude);
});
}
</script>
</head>
<body>
<textarea name="Address" id="Address" autocomplete="on" class="col-lg-offset-5" ></textarea>
<input type="text" name="latitude" id="latitude" autocomplete="on" />
<input type="text" name="longitude" id="longitude" autocomplete="on" />
</body>
</html>