topic Re: Button on Popup in ArcGIS JavaScript Maps SDK Questions

Button on Popup

BillChappell — Wed, 06 Jan 2016 15:54:03 GMT

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..

Re: Button on Popup

ChadKopplin — Wed, 06 Jan 2016 16:03:23 GMT

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?

Re: Button on Popup

BillChappell — Wed, 06 Jan 2016 16:37:00 GMT

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

Re: Button on Popup

ChrisSmith7 — Sun, 12 Dec 2021 03:25:58 GMT

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>")

Re: Button on Popup

SteveCole — Sun, 12 Dec 2021 03:26:01 GMT

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:

Re: Button on Popup

BillChappell — Wed, 06 Jan 2016 18:20:36 GMT

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,

Re: Button on Popup

SteveCole — Wed, 06 Jan 2016 18:21:48 GMT

No worries. It's all about getting it done!