On click JS function syntax Map marker

Question

I am trying to call a JS function on a button placed in the info window of map marker and pass the SFDC id to it, But the JS is giving me a syntax error. Here's my piece of code-

for(var i=0, j=mapData.length; i<j; i++){
   //Add marker for each point
    var myLatlng = new google.maps.LatLng(mapData[i].lat, mapData[i].lng);
    var markercolor= mapData[i].markerText;
    console.log(markercolor);

    if (markercolor.startsWith("00Q")){
      var contentString = '<a href="/'+ mapData[i].markerText + '" target="_blank">'+mapData[i].name+'</a>'+'<br/>'+
                           mapData[i].Street+',' +'<br/>'+ mapData[i].City +',' +'<br/>'+ mapData[i].State +'<br/>'+
                          "<input type='submit' id='butSubmit' value='Edit' onclick='openVFWindow("+mapData[i].markerText+")' >";
     }

       addMarker({position: myLatlng, markerText: contentString , color: markercolor});
 }

JS function-

function openVFWindow(markerid) {
   console.log('iddddddddd'+markerid);
}

So markerText has the Salesforce id of the record and its getting populated correctly. When I click on the console, the error is shown as

Uncaught SyntaxError: Invalid or unexpected token with the error line -openVFWindow(00Qg000000CcEezEAF)

Answer 1

You seem to missing string markers around the parameters in your onclick

Your code reads

onclick='openVFWindow("+mapData[i].markerText+")'

which renders as

onclick='openVFWindow(someId)'

JS then assumes someId is a variable, and not a value. Your should wrap the value in doublequotes, so that JS understands it is a literal. it looks like this while rendered:

onclick='openVFWindow("someId")'

You can achieve that by changing your code to the following

onclick='openVFWindow(\""+mapData[i].markerText+"\")'

The escaped doublequotes will render as regular doublequotes in the code.

Answer 2

You need to wrap the Id in quotes. It shouldn't be openVFWindow(00Qg000000CcEezEAF), it should be openVFWindow("00Qg000000CcEezEAF"). Or you could use single quotes if you like.

Change:

"<input ... onclick='openVFWindow("+mapData[i].markerText+")' >"

To:

"<input ... onclick='openVFWindow(\""+mapData[i].markerText+"\")' >"