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):