I have a button on a popup, if the attribute field is numeric, it passes the value to my function, if it's a string it fails.
infoTemplate: new InfoTemplate("CI Data", "Facility ID: ${ID} <br/> Facility Name: ${NAME} "
+ "<br/> County Name: ${CNTYNAME} <br/> City or Town: ${CITYTOWN}"
+ "<br/> Location Verified Date: ${VERDATE}"
+ "<br/> <button onclick='"
+ "ClickMe(${CNTYNAME});'"
+ ">Google</button>")
if the value is Albany, firebug says "Albany is not defined" if I pick a text field like address I get "missing ) after argument list". I scoured google and it looks like it doesn't like unquoted values, I've tried the string() and toString functions with out luck. Any ideas?
Thanks..
Solved! Go to Solution.
You might need to escape your quotes; here's an example how I set my content:
contextPopupTemplate.setContent("<div><strong>Foo: ${foo}</strong></div>" + "<hr>" + "<strong>Bar: </strong> ${bar}<br />" + "<strong>Bat: </strong> <a href=\"#\" onclick=\"window._contextPopup._initPopup(\'" + batLink + "\', 2);\">Bat</a>")
On your last line does your > need to be outside the quote? Also, does the semicolon on the second to last line need to be outside of the quote as well?
It has to be inside as it’s part of the html tag. The whole HTML string is quotes, thus the last closing quote.
However I tried it just to confirm it.
Thanks,
Bill
You might need to escape your quotes; here's an example how I set my content:
contextPopupTemplate.setContent("<div><strong>Foo: ${foo}</strong></div>" + "<hr>" + "<strong>Bar: </strong> ${bar}<br />" + "<strong>Bat: </strong> <a href=\"#\" onclick=\"window._contextPopup._initPopup(\'" + batLink + "\', 2);\">Bat</a>")
I would use a formatting function instead of trying to accomplish this in one JS line. Here's an example from one of my projects:
SetSwmPopupInfo: function(graphic) { var fullAttr = graphic.attributes; var rptParam, content, theProjID, theTipType; var theCipID = fullAttr.ProjectNo; var features = []; features.push(graphic); var fSet = new FeatureSet(); fSet.features = features; app.curInfoGraphic = fSet; rptParam = "'" + graphic.attributes.OBJECTID + ',' + graphic.geometry.type + ',' + "SWM" + "'"; rptProjectName = graphic.attributes.ProjTitle; if (theCipID.length > 1) { theProjID = fullAttr.ProjectNo; } else { theProjID = "Unknown"; } content = '<table width=\"100%\"><tr><td valign=\'top\' style=\"font-weight:bold;padding-left:3px;padding-right:3px\">Project Name:</td><td valign=\'top\' style=\"padding-left:3px;padding-right:3px\">' + fullAttr.ProjTitle + '</td></tr>'; content = content + '<tr><td valign=\'top\' style=\"font-weight:bold;padding-left:3px;padding-right:3px;vertical-align:top\">CIP Project ID:</td><td valign=\'top\' style=\"padding-left:3px;padding-right:3px;vertical-align:top\">' + theProjID + '</td></tr>'; content = content + '<tr><td valign=\'top\' style=\"font-weight:bold;padding-left:3px;padding-right:3px;vertical-align:top\">Type of Project:</td><td valign=\'top\' style=\"padding-left:3px;padding-right:3px;vertical-align:top\">' + fullAttr.Category.toProperCase() + '</td></tr>'; content = content + '<tr><td colspan=\"2\"><br/><div style=\"margin:0 auto;display:table;line-height:28px;\"><button id=\"reportButton\" type=\"button\" onclick=\"app.trf.getTractProjectReport(' + rptParam + ')\">View a Summary Demographic Report (Census Tract Level)</button><br\>'; content = content + '<button id=\"reportBlockButton\" type=\"button\" onclick=\"app.brf.getBlockProjectReport(' + rptParam + ')\">View a Summary Demographic Report (Block Group Level)</button></div></td></tr></table><br/>'; return content; }
Which looks like this once viewed in the application:
It was a quote problem,
The fix:
+ "<br/> <button onclick=\"ClickMe(\'+ ${GCADDRESS}+ \');\">Google</button>")
Now my button click passes the value in this field to a function.
Steve, for the record I did like your method and may use it in the future, however this was a quick and simple fix on a tight deadline. Thanks,
No worries. It's all about getting it done!