Skip to main content
All CollectionsBasics
Custom Actions
Custom Actions
Justin Yan avatar
Written by Justin Yan
Updated over a month ago

There are many situations in Frontly where you can add functionality and value to simple user actions by configuring automated actions on top of them. With Custom Actions, you can program the app can to do more for you and your users without compromising their experience with more manual clicks. Read on to learn how!


Custom Action Triggers

Below are the list of events where a Custom Action can be configured from and triggered:

  • Submitting or saving edits to a Form block

  • Submitting or saving edits to a Default Detail View

  • Submitting your inputs for a Quote Calculator block

  • Adding a Row Action to a Table block

  • Setting a Record Click Action to Custom Action

  • Setting a Click Action to a Button, Image or Text block

  • When a user moves a card from one column to another in a Kanban block.

  • When a new page loads through the Page Load Action

  • When a user signs up to your Frontly app for the first time (limited options)

  • When a user logs in to your Frontly app (limited options)


Creating and Layering Actions

Following the triggering of any of the events mentioned above, you can create a sequence of non-linear actions to create different outcomes based on the conditions you set for them. Clicking on the 'Select Step Type' will allow you to choose from one of many custom action options, and pressing the (+) symbol will create another node underneath that action.

Multi-layered actions will resolve and cascade from one action level to another until there are no more actions to fulfill. Creating additional action steps from a single event can be as simple or as complex as you want to make it, as shown below.

Important Note: One thing to keep in mind is that only one action step can execute at a time on any given level. In other words, if you have two or more action steps on a level, only one of them will resolve and continue along its sequence if needed.

The action resolved is determined by the first condition met in the Frontly system. Therefore, if multiple actions have their condition parameters set identically to one another, it may either default to one or not run at all.

When setting up some these layered actions, you may need to reference the output of a previous action step by using the 'step' variable.

Click here to read all you need to know about the Previous Step variable.


Run Conditions

Run conditions serves as criterion for an action to progress along your action flow. In cases where multiple actions exist at the same level, run conditions dictate which among them will be triggered.

After selecting any Frontly action, you can create a condition for it by clicking '+ Add Condition' button.

From there, click on the 'New Condition' modal that appears beneath it and it will open this form for you to edit.


Overview of Condition Fields

Value 1: Here is where you'll have to set your data source which will ideally be a dynamic variable. This data source is where the system will analyze the parameters you've defined in order to determine if the conditions have been met.

Operator: You would ideally want this to be 'Equal' to the 'Value' you will establish, but there are many other operators to choose from depending on how you wish to apply the conditions for your permissions.

Value 2: This can be static or dynamic. Clicking on the field will open an injector modal where you can select the dynamic variable of your choice. Within the data source you've defined for Value 1, the system will search for the value you've entered here and determine if the condition has been satisfied in relation to the Operator you've set.

Condition Type: Use this to specify how a condition will be combined with one or more other condition to create an expression:

  • When conditions are connected with an 'AND' operator, all specified conditions must be true for the entire expression to be true.

  • When conditions are linked with an 'OR' operator, the expression is true if at least one of the conditions is true.


Overview of Custom Actions

Select from one of several different custom actions. Each action is grouped by type.


Navigate To Page

Navigate the user to a different page in your app with or without URL parameters or an external link.

Click here to learn more about URL Parameters


Data Source Request

Previously known as Google Sheet Request, select an imported data source and choose to add net new values to its existing columns (Create Action Type), modify and update a specific row of data (Edit Action Type), or delete altogether.

Click here for an article about the Get Data Source Request Action Type


Notification

Show a popup notification with custom text. Generally this would be used for some kind of confirmation, like 'Thanks for submitting this form', or 'Successfully submitted'.


Send Email

Trigger an email to be sent when this action is triggered. This action has fields for a custom email body, recipient, subject line, and more.
โ€‹


Webhook

Establish a POST request webhook function to send information. Customize its header and body settings, and make sure it operates efficiently in its designated location.

Note ๐Ÿ’ก: The only difference between the 'front-end' and 'back-end' versions of the webhook is the location in Frontly's system where the final request to your webhook address is made from. In most cases, this doesn't make any difference. We recommend starting with the 'front-end' version and then only if you experience issues, try the back-end option as a fallback.

Click here to learn more about our Realtime Webhook Function


OpenAI Request

Generate text content into your Frontly app as you would expect from your OpenAI account. Each user submissions will use up one AI token from your Frontly account.

Click here for more details about the OpenAI Request custom action.


Update Local State

To handle more complex conditional logic scenarios, use this feature to establish and manage data key/value pairs stored within the user's session.


โ€‹Click here to learn how to use Local States in your app.


Logic

Explore a wide range of data manipulations and logic operations. Easily adjust your processes by adding, removing, or changing data to suit your specific needs.

Click here to learn more about the Logic Action.


Update Active User

Create a real time update to the active user's user fields.


Time Delay

Set the amount of time (in seconds) before the next action in your sequence is executed.


'Make' Scenario

Click here to learn more about our 'Make' integration with Frontly


Zapier Trigger

Click here to learn more about our Zapier integration with Frontly


Refresh Blocks

Update the values in realtime for any number of blocks on your page.


CSV Download

Choose a data display block you wish to generate a csv file from (Chart, Table, Kanban, Grid, Calendar).

Simply select the block you want to download data from and then optionally enter a filename. This can be triggered from any action on the page.

Optionally choose only specific columns to be included, or download all if none are selected.


Copy to Clipboard

Allows users to quickly copy selected text or data to the system clipboard for easy pasting elsewhere.

The value can be static or dynamic, and is best used with the Input blocks and referencing their 'Field ID' as its value.


Form Validation

This action will appear if a User Input Block exists on the page. This action will check the user's inputs against any validation you set on the block, and will show errors if the input is not valid and the 'Show Field Errors' toggle is turned on.

Click here to learn about User Input Blocks and how to set up input validation for them.


Web Scraper

Have your users enter in a valid URL for Frontly to collect its content which can be used to as one of your inputs for your OpenAI Request action.

Click here to see how this action can be paired up with the OpenAI Request one.

Did this answer your question?