Authenticated Web Form Use Case

Options
Aly_142377
Aly_142377 Posts: 18 admin
edited October 2020 in Show and Tell

With new enhancements to our Webhook and Web Form functionality, users have the ability to unlock a whole suite of exciting and creative use cases. While our first release of this new feature will require some builder creativity, we plan on making the building experience easier in future iterations. Some of the possibilities include:

  • Authenticated Web Form users
  • Generate documents and provide download links
  • Customization of form success and failure page
  • Enable users to submit same form multiple times

Below is an example of how someone can configure an authenticated Web Form experience using existing Web Form functionality and new feature enhancements included in our October 2020 release.

Authentication & Display Data Dynamically

Use Case: You have dynamic data that you wish to display to users that are not a member of your Catalytic team.
Solution: Using a combination of a Web Form, a Webhook Trigger, and Data Tables, we can intake a user's credentials, validate them, and display the appropriate response.

What the user experience looks like

Web Form to intake user's credentials --> Custom HTML Webhook trigger response to display user data on successful authentication, or a failed login page when authentication does not succeed

How it's built

1. Workflows:

Workflow One: Webform to intake authentication fields
Export of Workflow (does not include the Web Form trigger configuration! That will need to be configured after importing the Workflow)

The full URL for this Web Form to additionally kick of the Webhook trigger would be https://testing-uat.pushbot.com/form/user-login?ref-success=https://testing-uat.pushbot.com/v1/webhooks/eec3c92ab58c7a018467b2c06dd1e8116de11bf503ab8c15321b1b62e2b9d423?startRun=true

Workflow Two: Webhook trigger to check authentication and render appropriate response
Export of Workflow (does not include the Webhook trigger configuration! That will need to be configured after importing the Workflow following the configuration provided below)

Webhook Trigger configuration for Workflow Two:

2. Tables:

  1. Master table

Sample response template for success - Note that you can insert field references from your instance to display on your custom HTML response!

Sample response template for failure - for simplicity, I stored this template in a field formula step, but could additionally be stored in the data table in a Failed Response Template column for each user.

  1. Example grade's table

With only two workflows, and a handful of data tables, you now have the ability to present dynamic data to user's behind an authenticated Web Form!

Future iterations could include:

  • An option to select the type of login (edit vs read-only), so an administrator can make edits on another gated Web Form that then update the dynamic information.

Don't forget!

Feel free to use the two exported processes as a starting point, but you will need to make a few changes in order to get everything working correctly:
1. The Web Form and Webhook trigger configurations will need to be set up after importing
2. The team name in the URLs referenced in the HTML templates and Webform will need to be replaced. (Anywhere testing-uat is referenced should be changed to your teams name)
3. The Data Table IDs in the Grades Table columns in the User Grades Login table will have to be updated to reference the Data Tables you create after importing the Grades CSVs

Let me know if you have questions or feel free to share your expanded examples!

Comments

  • Rafael_943505
    Rafael_943505 Posts: 21
    edited October 2020
    Options

    Hi,
    I get on the field {{get-fields--response--body--text}} = "You need to enable JavaScript to run this app."
    Can you please tell me what am I doing wrong?

  • Aly_142377
    Aly_142377 Posts: 18 admin
    Options

    Hi @Rafael_943505 ,

    Would you be able to email me a screenshot of your configuration for that step? I am unfamiliar with that error message.

    aly@catalytic.com

    Thanks!

  • Grant_195014
    Options

    Hi Aly,

    Are you supposed to adjust the Form URL on workflow 1 to resemble
    https://testing-uat.pushbot.com/form/user-login?ref-success=https://testing-uat.pushbot.com/v1/webhooks/eec3c92ab58c7a018467b2c06dd1e8116de11bf503ab8c15321b1b62e2b9d423?startRun=true

    If so, I'm unable to add a "?" to the webform URL

  • Tom_177058
    Options

    ^^ @Aly_142377

    Would you mind taking a look at Grant's question?

  • Aly_142377
    Aly_142377 Posts: 18 admin
    Options

    Hi @Grant_195014 ! The actual Form URL associated with a workflow cannot be saved with those query parameters, however, any link place you link to the form should include those parameters. Let me know if you still have questions.

  • Theis_171203
    Options

    Hi @Aly_142377 ,
    interesting use case, thank you for sharing!
    Is there an option to display webform fields only if the internal email address is inserted correctly (e.g. email address must contain "company_name")? The Regex configuration is only validated when submitting the webform.