ArcGIS JS API 3.21 InfoTemplate ZoomIn Button

MatthewDewell

Has anyone had luck attaching a click event to a custom button built in the HTML of the InfoTemplate? Here's my InfoTemplate HTML:

uploadInfoTemplate = new InfoTemplate ({     title: "",     content: "<strong>Segment:</strong> ${segment}" +              "<hr/>" +              "<strong>Time:</strong> <i>${dateTime}</i>" +              "<div style='width: 100%; text-align:right;'>" +                  "<input class='zoomButton' type='button' value='Zoom to' />" +              "</div>" });

I then have hidden items on the default InfoTemplate, i.e. the zoomTo link. I want to simply replace the zoomTo's functionality with a button, to make it look a little nicer.

MatthewDewell

Hello Robert,

I may be looking for using featureLayers in a bit here, but I got the actionList button to work by using some of your suggestion's example:

var zoomButtonHTML = '<div style="width: 100%; text-align: right;"><input type="button" value="Zoom to" /></div>';

var zoomButton = domConstruct.create("div", {

    "class": "action",

    "id": "uploadLink",

    "innerHTML": zoomToButtonHTML

}, query(".actionList", this.map.infoWindow.domNode)[0]);

on(zoomButton, 'click', this._zoomToPoint);

My code then loops through all the points I have to plot, where I pass the zoom Button object to the _pointPlot function for each point.  Wherein, I define my uploadInfoTemplate:

uploadInfoTemplate = new InfoTemplate({

    domNode: zoomButton,

   title: "",

   content: content

});

I guess I'm lucky, I didn't have to go about creating a FeatureLayer, and it seems to have just used the InfoWindow/infoTemplate.  Now, it looks like I'm going to have to go about translating the x/y cords of the graphic to the actual lat/long.  Is that the WebMercator I use?  Oh well.

Thank You ... again,

Matt

Note: I got the idea from Robert's post about the example - Geoprocessing tool link in popup | ArcGIS API for JavaScript 3.21  above.