topic Re: How to add custom link or button in info window and get the event in arcgis web appbuilder? in ArcGIS Web AppBuilder Questions

How to add custom link or button in info window and get the event in arcgis web appbuilder?

ShaikhRizuan — Mon, 01 Aug 2016 04:53:49 GMT

Hi,

I want to add a link or button in info window like "ZoomIn" after Search done from search widget and get the button event in the widget.js of search widget in ArcGIS web AppBuilder.

Also i have attached the screenshot for better understanding of the requirement (highlighted in red color).

Any suggestions or code??

Regards,

Shaikh Rizuan

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

GirishYadav — Sat, 11 Dec 2021 22:45:11 GMT

Shaikh,

Following are the functions to add/remove custom link/button into the info window. Include these functions into the search widget's widget.js. and define onClick handler (_onCustomAction).

_addAction: function(){
    var link = domConstruct.create("a",{
                "class": " action my-action", //give it a unique class
                "id": "customAction",
                "innerHTML": "My Action", //text that appears in the popup for the link 
                "href": "javascript: void(0);"
              }, query(".actionList", this.map.infoWindow.domNode)[0]);


     //when the link is clicked register a function that will run 
     on(link, "click", this._onCustomAction);
}

_removeAction: function() {
     //to remove either store "link" var into a global or get it by class using dojo/query
     query(".my-action", this.map.infoWindow.domNode).forEach(function(elem){
          elem.destroy();
     })
}

Call this _addAction method in "_onSearchResults" method inside Search widgets's widget.js.

Hopefully this should do what you want.

Thanks,

Girish

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

ShaikhRizuan — Mon, 01 Aug 2016 13:43:14 GMT

Thanks Girish... Its working now!!

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

Anonymous User — Thu, 04 Aug 2016 19:58:12 GMT

slick, I'll have to come to this. For now, to do links to our Tax Cards which have a unique number (primary key) in the URL I put that in as a link http://thelink/{PropertyNumber} for a Picture in the bottom of the popup. I did a screenshot of the word "Tax Card" with a button as a background, put it in, works like a charm.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RichBell — Fri, 05 Aug 2016 14:00:46 GMT

Nice!

Help Please????

I'm not as savoy as to how to do this. Could someone show the completed addition of the example code in the Search widget.js and if there are any other files that need to be edited? I would really like to do this too!.....

Rich

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

Anonymous User — Mon, 08 Aug 2016 15:14:58 GMT

I put the links in the popup in the Configure Popup in ArcGIS Online.

Just create a picture, put it in a specific spot in WAB and put this path in for the URL to the Picture. Maybe a picture of the word "Site Plan" or something. (instead of Tax Card in our case)

Then, put in a description (optional) and for the link, the first part of it like http://yoursite.com/files/{PDFfilepath}

The {PDFfilepath} in brackets would be a filename, for files in a folder full of PDF files, for example, on your server. This would be assuming you had a field in your layer like 'filepath' that contained the filename. ThePDFfilepath therefore takes the value of whatever the layer has in that field for that record. Savvy matey? Just let me know if this helps shed more light on it for you.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RichBell — Mon, 08 Aug 2016 15:50:42 GMT

Thanks, but not quite what I was looking for.

More specifically is where and how do I insert this snippet of code from the last post into the search Widget.js?

A screen shot of a working widget with this code inserted would be great.

Rich

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

AdamCommeford — Mon, 16 Jan 2017 14:39:34 GMT

Hi Girish,

Could you explain where and how to "Call the _addAction method" ?

Thanks

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RobertScheitlin__GISP — Tue, 17 Jan 2017 13:41:03 GMT

Adam,

Call this _addAction method in "_onSearchResults" method inside Search widgets's widget.js.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

AdamCommeford — Tue, 17 Jan 2017 16:43:36 GMT

Hi Robert,

is it possible to call the editor from this button that will used the selected geometry that was returned as a search result?

I would like the user to use the search widget to find the required address, and then add this address and its attributes to a FS.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RobertScheitlin__GISP — Tue, 17 Jan 2017 16:45:51 GMT

Adam,

Custom actions know which feature is selected to show the popup, so yes.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

AdamCommeford — Tue, 17 Jan 2017 18:37:41 GMT

Thanks for your help Robert. I am still trying to get this to work, have not been able to successfully call the method, are there any examples I maybe able to reference? Any examples of using this process to call the attribute editor?

Thank you in advance

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RobertScheitlin__GISP — Tue, 17 Jan 2017 19:09:22 GMT

No that I am aware of.

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

esriuser2 — Wed, 17 May 2017 18:30:10 GMT

I got this example worked. But I want the link/button to be visible for only one feature layer map infowindow and not to be visible for any of the other feature layers map info windows.

How to accomplish this?

Thank you!

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

MarkTurnbull — Wed, 10 Jul 2019 06:46:34 GMT

Answer looks like a good solution, but if I wanted these actions to appear in the default map callout (not the search widget callout), where would I add this code? Is this code relevant for the default map callout?

Re: How to add custom link or button in info window and get the event in arcgis web appbuilder?

RobertScheitlin__GISP — Wed, 10 Jul 2019 12:39:10 GMT

Mark,

https://developers.arcgis.com/web-appbuilder/sample-code/create-a-feature-action-in-your-widget.htm

To have an action appear in the map default popup you can add the feature action to the jimu.js\featureActions folder and add a reference to your featureAction to the main.js