How to create buttons to invoke survey123 from workforce or collector

RogerMesen-Delgado · ‎05-14-2018

There is a way to invoke #Survey123 with the fields fill. With the URL. if you want to know more about how to configure the URL is better to check the following link (click here). In the blog Ismael Chivite explain deeply how to use the url.

This blog is more about how to transform the link in a button to show a better graphic interface to the user.

Basically when you have the link with the url of the form and you are setting the pop-up you can configure a "kind of button", with the following #html code.

<a href="arcgis-survey123://?itemID=xxxxxxxxxxxxxxxxxxxx" style="display: inline-block; outline: none; cursor: pointer; text-align: center; font-style: normal; font-variant: normal; font-weight: normal; font-stretch: normal; line-height: 100%; font-family: Arial, Helvetica, sans-serif; padding: 0.5em 0.8em 0.55em; text-shadow: rgba(0, 0, 0, 0.3) 0px 1px 1px; border-radius: 0.5em; box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 2px; text-decoration: none; color: rgb(255, 255, 255) !important; background: rgb(17, 127, 170) !important;">Orden de Trabajo</a> <br /><div style="text-align: center;"> </div>

</font>

this code shows up the following button in collector or workforce. Depending of the pop up that you set.

As you can see is a better interface that a link for the user. I you need more information just let me know in the comments.

AprilChipman · ‎05-17-2018

Where would this button show up in Workforce and Collector?

JamesTedrick · ‎05-17-2018

Hi April,

Workforce already has an integration with Survey123 built into the app - see Esri Apps for Field Work, Work Together for more information. In the case of Collector, you would substitute the link in the pop-up with the formatting.

JamesTedrick · ‎05-17-2018

Hi Roger,

Great idea - that certainly makes the visual much more accessible!

ColemanShepard · ‎05-29-2018

Hello!

Thank you for posting the code for the button! I'm running into issues regarding formatting across Esri applications. When I configure the button in a web application the button looks fine in the Collector application (See Image 1), but all the styling does not seem to carry over to the Workforce or Explorer applications (See Image 2). Has anyone experienced similar problems and know a work-around?

The images are from a IOS device.

Image 1. Button viewed in Esri's Collector application

Image 2. Button viewed in Esri's Workforce and Explorer applications