You need to sign in to do that
Don't have an account?
Somya Tiwari
Help Needed to Integrate Google Maps API with VisualForce Page
I want to integrate Google Maps API with a VisualForce Page to generate Autofill Suggesstions for Address. When i use <Apex:InputText> tag Google Maps API gives following error:
Apex Controller
InvalidValueError: not an instance of HTMLInputElementHence i am using HTML tags for taking the Input, now can anyone help me to get this input into the controller?
Apex Controller
public class location { //public location(ApexPages.StandardController controller){} public void receiveInput() { System.debug('Google'); string search0 = Apexpages.currentPage().getParameters().get('search0'); string search1 = Apexpages.currentPage().getParameters().get('search1'); System.debug('Search 0' + search0); System.debug('Search 1' + search1); } }VisualForce Page
<apex:page controller="location"> <apex:form id="form1"> <apex:pageBlock title="Submit Location" id="loc"> <label>Location 1</label> <input id="search0" name="search0" type="text" size="50"/> <label>Location 2</label> <input id="search1" name="search1" type="text" size="50"/> <apex:commandButton onClick="callActionFunction(search0, search1);" value="Click Here!"/> <apex:actionFunction name="SearchLocation" action="{!receiveInput}"> <apex:param name="search0" assignTo="{!search0}" value=""/> <apex:param name="search1" assignTo="{!search1}" value=""/> </apex:actionFunction> </apex:pageBlock> </apex:form> <script src="https://maps.googleapis.com/maps/api/js?key=**INSERT_YOUR_GOOGLE_API_HERE**&libraries=places"></script> <script type="text/javascript"> //for first searchbox function initialize() { var input = document.getElementById('search0'); //Element ID of 2nd = search0 new google.maps.places.Autocomplete(input); } //for second SearchBox function initialize2() { var input2 = document.getElementById('search1'); //Element ID of 2nd = search1 new google.maps.places.Autocomplete(input2); } google.maps.event.addDomListener(window, 'load', initialize); google.maps.event.addDomListener(window, 'load', initialize2); function callActionFunction(v1, v2) { var val1, val2; val1 = document.getElementById(v1); val2 = document.getElementById(v2); alert(val1); alert(val2); alert(document.getElementsByName(search0)); SearchLocation(val1, val2); } </script> </apex:page>Result What i need !!