Skip to main content
All CollectionsAdvanced
Javascript Action
Javascript Action
Patrick avatar
Written by Patrick
Updated over 3 months ago

Warning: This is an advanced feature that involves writing actual code. This is not suitable for most users.

Frontly's JavaScript action allows you to write javascript functions to manipulate data within a custom action.

Most standard javascript is accepted. See the examples below for ideas about how to use this action. Frontly system variables are supported.

Example 1: Custom user greeting showing the user's name and the first three names of the products in the current table on the page (block 1):

let name = '{{user.first_name}}';

let top3Products = [];

{{block.1}}.forEach(record => {

if (top3Products.length < 3){
top3Products.push(record.name);
}

});

const top = top3Products.join(', ');

return `Hello, ${name}! Your top three recommended products are ${top}`;

Example output would be something like:
โ€‹Hello Patrick, Your top three recommended products are Product 1, Product 2, Product 3.

Example 2: Assuming the previous step returns a list of multiple records, this code returns a custom string with the record names and their index in the list.

return step['1'].map(function(record, index) { return record.name + ' has index ' + index; }).join(', ');

This would output something like:
โ€‹Product 1 has index 0, Product 2 has index 1

Example 3: Do some basic math

const originalPrice = {{ user.price_paid }};

const total = originalPrice / 2;

return total

For this example, we'll show an actual app setup to make it more realistic:

1. A button to trigger the javascript action, and two text blocks to show the user's 'price_paid' field as it is now, and then a new local state field to display our 'new_price' we'll generate with javascript:

2. A two-step custom action with a Javascript step followed by an Update Local State step:

3. The javascript written in the step:

4. The Update Local State action:

5. The final result (after button click):

Did this answer your question?