You need to sign in to do that
Don't have an account?
Rabia Bajaj 12
I need help with the following javascript code
I need help with the following code, I need latitude and longitude information using google map API javascript in visualforce Page and I have embedd this visualforce Page in account page in account detiail section. The Problem is when I upload the data using data loader the Lat/longitude are not coming. WHat to do with that?
<apex:page standardController="Account">
<apex:pageBlock >
<head>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="/soap/ajax/27.0/connection.js" type="text/javascript"/>
<script type="text/javascript">
$(document).ready(function() {
var myOptions = {
zoom: 20,
mapTypeId: google.maps.MapTypeId.HYBRID,
mapTypeControl: true
}
var map;
var marker;
var of;
var of1;
var geocoder = new google.maps.Geocoder();
var address = "{!Account.ShippingStreet}, " + "{!Account.ShippingCity}, " + "{!Account.ShippingPostalcode}";
var infowindow = new google.maps.InfoWindow({
content: "<b>{!Account.Name}</b>"
});
geocoder.geocode( { address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
//create map
map = new google.maps.Map(document.getElementById("map"), myOptions);
//center map
map.setCenter(results[0].geometry.location);
//create marker
marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map,
title: "{!Account.Name}"
});
//add listeners
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
map.setCenter(marker.getPosition());
});
}
} else {
$('#map').css({'height' : '15px'});
$('#map').html("Oops! {!Account.Name}'s address could not be found, please make sure the address is correct.");
resizeIframe();
}
of= results[0].geometry.location.lat();
of1 = results[0].geometry.location.lng();
var mappedContact = new sforce.SObject('Account');
mappedContact.ShippingLatitude = of;
mappedContact.ShippingLongitude = of1;
mappedContact.Id="{!Account.Id}";
result = sforce.connection.update([mappedContact]);
});
function resizeIframe() {
var me = window.name;
if (me) {
var iframes = parent.document.getElementsByName(me);
if (iframes && iframes.length == 1) {
height = document.body.offsetHeight;
iframes[0].style.height = height + "px"; }
} }
});
</script>
<style>
#map {
font-family: Arial;
font-size:12px;
line-height:normal !important;
height:500px;
background:transparent;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</apex:pageBlock>
</apex:page>
<apex:page standardController="Account">
<apex:pageBlock >
<head>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="/soap/ajax/27.0/connection.js" type="text/javascript"/>
<script type="text/javascript">
$(document).ready(function() {
var myOptions = {
zoom: 20,
mapTypeId: google.maps.MapTypeId.HYBRID,
mapTypeControl: true
}
var map;
var marker;
var of;
var of1;
var geocoder = new google.maps.Geocoder();
var address = "{!Account.ShippingStreet}, " + "{!Account.ShippingCity}, " + "{!Account.ShippingPostalcode}";
var infowindow = new google.maps.InfoWindow({
content: "<b>{!Account.Name}</b>"
});
geocoder.geocode( { address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length) {
if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
//create map
map = new google.maps.Map(document.getElementById("map"), myOptions);
//center map
map.setCenter(results[0].geometry.location);
//create marker
marker = new google.maps.Marker({
position: results[0].geometry.location,
map: map,
title: "{!Account.Name}"
});
//add listeners
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
map.setCenter(marker.getPosition());
});
}
} else {
$('#map').css({'height' : '15px'});
$('#map').html("Oops! {!Account.Name}'s address could not be found, please make sure the address is correct.");
resizeIframe();
}
of= results[0].geometry.location.lat();
of1 = results[0].geometry.location.lng();
var mappedContact = new sforce.SObject('Account');
mappedContact.ShippingLatitude = of;
mappedContact.ShippingLongitude = of1;
mappedContact.Id="{!Account.Id}";
result = sforce.connection.update([mappedContact]);
});
function resizeIframe() {
var me = window.name;
if (me) {
var iframes = parent.document.getElementsByName(me);
if (iframes && iframes.length == 1) {
height = document.body.offsetHeight;
iframes[0].style.height = height + "px"; }
} }
});
</script>
<style>
#map {
font-family: Arial;
font-size:12px;
line-height:normal !important;
height:500px;
background:transparent;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
</apex:pageBlock>
</apex:page>
In General, The approach you need to take to update the fields on the records when a record is inserted is to write a Trigger on that object. Check here
https://www.packtpub.com/books/content/adding-geolocation-trigger-salesforce-account-object
PS: please note that the code does a future callout which means that update will not happen immediately but sometime in future. You might also think about implementing similar soln using Batch / Schedule way..