As i am beginner to Salesforce and i was trying to create a visual force page to display Hotel location but as i am checking the preview is showing blank and i am creating the app with the help of Trailhead. App Name : Conference App. Below is my code. Please suggest for this
Class: global class HotelRemorter { @RemoteAction global static List<Hotel__c> findAll(){ return [Select Id, Name, Location__Latitude__S, Location__Longitude__S from Hotel__c]; } }
Visualforce Page:
<apex:page controller="HotelRemorter"> <head> <style type="text/css"> html {height : 50%} body {height:50%, margin:0, padding:0} #map-canvas {height:50%} </style> <script src="https://maps.googleapis.com/maps/api/js?sensor=false" /> <script> var map;
function initialize(){ var mapOptions = {center: new google.maps.LatLng(37.784173, -122.401557), Zoom: 15}; map = new google.maps.Map(document.getElementbyId("map-canvas"), mapOptions); loadHotels(); } function loadHotels(){ Visualforce.remorting.Manager.invokeAction('{!$RemoteAction.HotelRemorter.findAll}', function(result, event){ if(event.status){ for(var i = 0; i<result.length, i++){ var id = result[i].Id; var name = result[i].Name; var lat = result[i].Location__Latitude__s; var lng = result[i].Location__Longitude__s; addMarker(id, name, lat, lng); } }else{ alert(event.message); } }, {escape: true} ); } function addMarker(id, name, lat, lng){ var marker = new google.maps.Marker({position: new google.Maps.LatLng(lat, lng), map:map, title: name}); google.maps.event.addListener(marker, 'click', function(event){window.top.location = '/' + id; }); } google.maps.event.addDomListener(window, 'load', initialize); </script>
</head> <body> <div id="map-canvas" /> <p> Welcome to Google Map </p> </body> </apex:page>
Can you give us some more details about the problem that you are experiencing? What is your goal and what have you tried so far?
Hi All,
As i am beginner to Salesforce and i was trying to create a visual force page to display Hotel location but as i am checking the preview is showing blank and i am creating the app with the help of Trailhead. App Name : Conference App. Below is my code. Please suggest for this
Class:
global class HotelRemorter {
@RemoteAction
global static List<Hotel__c> findAll(){
return [Select Id, Name, Location__Latitude__S, Location__Longitude__S from Hotel__c];
}
}
Visualforce Page:
<apex:page controller="HotelRemorter">
<head>
<style type="text/css">
html {height : 50%}
body {height:50%, margin:0, padding:0}
#map-canvas {height:50%}
</style>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false" />
<script>
var map;
function initialize(){
var mapOptions = {center: new google.maps.LatLng(37.784173, -122.401557), Zoom: 15};
map = new google.maps.Map(document.getElementbyId("map-canvas"), mapOptions);
loadHotels();
}
function loadHotels(){
Visualforce.remorting.Manager.invokeAction('{!$RemoteAction.HotelRemorter.findAll}',
function(result, event){
if(event.status){
for(var i = 0; i<result.length, i++){
var id = result[i].Id;
var name = result[i].Name;
var lat = result[i].Location__Latitude__s;
var lng = result[i].Location__Longitude__s;
addMarker(id, name, lat, lng);
}
}else{
alert(event.message);
}
},
{escape: true}
);
}
function addMarker(id, name, lat, lng){
var marker = new google.maps.Marker({position: new google.Maps.LatLng(lat, lng), map:map, title: name});
google.maps.event.addListener(marker, 'click', function(event){window.top.location = '/' + id; });
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas" />
<p>
Welcome to Google Map
</p>
</body>
</apex:page>
Please suggest for this.
Thanks & Regards,
Amit Kumar