Google maps blank on final repository submission

asked on July 14, 2017

Hi,

I'm currently designing a form that will allow users to move a marker and get a position of a small area and place a marker and then save the latitude and longitude.

I used this thread as an idea https://answers.laserfiche.com/questions/77786/Custom-HTML-how-to-Hold-or-freeze-an-custom-HTML-active-script-when-submitting-

In my example I save the latitude and longitude from the previous step and I grab it from the text boxes which works fine in the second step when the reviewers get to the form and they can see the updated area, the issue is when it gets approved and saved into the repository for a second time the google maps fails to load and I just get a blank page.

Anyone have any ideas?

window.onload=function(){

          var lat = document.getElementById("Field31").value;
          var long = document.getElementById("Field43").value;
          var map;
          function initialize() {
              var myLatlng = new google.maps.LatLng(58.2020, 6.393838);

              var myOptions = {
                  zoom: 17,
                  center: myLatlng,
                  mapTypeId: google.maps.MapTypeId.SATELLITE
              };
              map = new google.maps.Map(document.getElementById("q40"), myOptions);

              var marker = new google.maps.Marker({
                  draggable: true,
                  position: myLatlng,
                  map: map,
                  title: "Your location"
              });

              google.maps.event.addListener(marker, 'dragend', function (event) {
                  document.getElementById("Field31").value = event.latLng.lat();
                  document.getElementById("Field43").value = event.latLng.lng();
                  infoWindow.open(map, marker);
              });
          }
          google.maps.event.addDomListener(window, "load", initialize());
        }//]]>

0 0

replied on July 16, 2017

When form is being saved to repository, it is first converted to a read-only form, so there is no "input" element and document.getElementById("Field31").value won't work.

In the other post, the following is used to retrieve field value on read-only field form:

if ($('#Field3').prop('tagName') != 'INPUT') {
    var divlatlong = document.getElementById("Field3").innerHTML;
    drawMap(divlatlong);
  }

0 0

replied on July 17, 2017 • Show version history

This works.

$.getScript('http://maps.googleapis.com/maps/api/js?key=KEYw&libraries=places', function() {
     
        var latVal = document.getElementById("Field31").value;
        var longVal = document.getElementById("Field43").value;
  		
     	//var lat = document.getElementById("Field31").innerHTML;
    	//var long = document.getElementById("Field43").innerHTML;
        // document.getElementById("mapImg").src="http://maps.googleapis.com/maps/api/staticmap?center=" + lat + "," + long + "&zoom=17&size=700x300&markers=color:red|" + lat + "," + long + "&maptype=satellite&region=gb";
        // document.getElementById("mapImg").src="http://maps.googleapis.com/maps/api/staticmap?center=58.207958,-6.391567&zoom=17&size=700x300&markers=color:red|58.207958,-6.391567&maptype=satellite";
	
	
 getLocation();
  
  function getLocation() {
   if (navigator.geolocation) {
     navigator.geolocation.getCurrentPosition(showPosition);
   } else {
     document.getElementById("q30").innerHTML = "Geolocation is not supported by this browser.";
   }
 
 }
  
  
  
  function showPosition(position) {
   $('#q45 input').val(latVal + "|" + longVal);
   drawMap($('#q45 input').val());

 }
  
  
  
 if ($('#Field45').prop('tagName') != 'INPUT') {
   var divlatlong = document.getElementById("Field45").innerHTML;
   drawMap(divlatlong);
 }
  
 function drawMap(n) {
   var position =  n.split('|');
   var latitude = position[0];
   var longitude = position[1];
   document.getElementById("q30").innerHTML = "<br />Latitude: " + latitude + "<br />Longitude: " + longitude;
  var google_tile = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=16&size=400x150&markers=color:red|" + latitude + "," + longitude;
   var canvas = document.getElementById("map_canvas");
   var context = canvas.getContext("2d");
   var img = new Image();
   img.src = google_tile;
   img.onload = function(){
     context.drawImage(img, 0, 0);
    } 

 }

   //google maps function end 
   });

0 0

Question

Question

Google maps blank on final repository submission

Replies

Sign in to reply to this post.