pass parameter to embedded href='javascript:function(“ + param + ”);

Question

I'm trying to embed a call to a javascript function in a leaflet popup.

I'm binding the showPopup() function to each feature added to a map. The idea is when the user clicks on the feature, there is an href labeled "More info..." which should open a sidebar.

I'm attempting to pass in the features Code to the embedded 'javascript:getInfoPanelData(feature code here, say PIPE as example) to know which feature I'm working with. However, running this code in Chrome debugger yields

Uncaught ReferenceError: PIPE is not defined at :1:18.

I've also tried to add single quotes around the parameter, but this yields a SyntaxError:

Unexpected end of input (getInfoPanelData("red x" in debugger.

I'm not sure I can actually do what I need to do and am hoping someone can either point out my mistake or possible alternatives.

 /*** Code that builds the popup ***/ function showPopup(feature, urlString) { console.info("onEachFeature: " + feature.properties.Code + " | " + feature.properties.NAME); var pkVal = parseInt(feature.properties.ParkType, 10); var parkIcon = "nationalpark-40.png"; var retHtml = "<div id='popup' class='popup'>" + "<h3 align='center'><img src='icons/" + parkIcon + "'/>" + feature.properties.NAME + "</h3>" + "<p>State: " + feature.properties.State + " | parkCode: " + feature.properties.Code + " | parkType: " + pkVal + "</p>" + "<p>Home Page: " + "<a href='" + urlString + "' target='_blank'>" + urlString + "</p>" + "<p><a href='javascript:getInfoPanelData(" + feature.properties.Code + ");'> More Info...</a></p></div>"; console.info("HTML: " + retHtml); return retHtml; } 

 /*** Code that binds the popup to the feature ***/ /* Create our NPS Layer */ var npsCPs = new L.GeoJSON.AJAX("data/NPS_4326_CPs.json", { pointToLayer: function(feature, latlng) { return L.marker(latlng, { icon: npsIcon }); }, onEachFeature: function(feature, layer) { var urlStr = "https://www.nps.gov/" + feature.properties.Code + "/index.htm"; layer.bindPopup(showPopup(feature, urlStr)); } }); 

Answer 1

in the code snippet:

<a href='javascript:getInfoPanelData(" + feature.properties.Code + ");'>

you do want to quote the feature.properties.Code . However, you can't just put a singe-quote in there as you're using single-quotes for the href property. You also can't just put double-quotes in there because you're using double-quotes for your string. You need to escape your quotes, for example:

<a href='javascript:getInfoPanelData(\"" + feature.properties.Code + "\");'>