Sisense BloX 2.0 has introduced custom actions. These answer any need for interactivity that is not met by the 5 native action types.
Once an action is created, its snippet is added to the “My Actions” section of the actions tab, and it can be called, updated or deleted by any designer working in Sisense.
When creating a custom action, you may use pure JavaScript syntax as well as libraries used in Sisense, such as jQuery, underscore.js, and moment.js. The action can access prism and other global variables.
Upon saving, the action's, code goes through Babel, transforming it into ES5 for cross-browser compliance purposes. This transformation is transparent to the designers, that will still see their original syntax any time they choose to edit the action.
Payload
Custom actions can use an argument named payload to access most of their relevant information.
We’ll review a few important payload properties that any action will be able to access:
Container: The DOM element holding the widget body. Can be very useful for jQuery selectors.
Data: The action’s data property. When you define a new custom action, the best practice is to populate the data property with all attributes and variables that you would like your action to get from the card. This is also where all input fields’ values are contained. <link to populating data>
Result: Contains the data panels of the specific card that triggered the action. For the full widget result set, it is better to access payload.widget.queryResult.
Widget: The Sisense BloX widget object. You can use this object to access the widget’s structure and result set as well as the parent dashboard and its attributes (filters, other widgets in the dashboard, etc.)
In addition to the above native properties, the payload will also contain any property that will be added to the action (see example below).
Creating An Action
To create a custom action, open the editor’s main menu and choose “Create Action”.
The design panel Should now turn into a Javascript editor.
Give your action a javascript-friendly name, preferably camel cased.
Now you can define your action’s functionality.
Click Next to go to the next step and define your action’s snippet.
As snippets were meant to help designers add elements and actions to their cards, it’s crucial to make sure that yours includes all of the inputs that your action needs to run properly.
Once saved, the action and snippets will be saved on the Sisense application DB and will be visible to all other designers in the Sisense BloX actions tab.
Copy the snippet to the clipboard and paste it to an action container in the Sisense BloX editor to test it.
You can find the snippets for action containers in the Actions tab’s Action Buttons section.
If any inputs were included, such as the text attribute, adjust their values to this action button’s specific requirements.
Now, click on one of the action buttons to trigger it.
In our case, we will see out action’s output in the browser’s JavaScript console:
Editing and Deleting Actions
Any designer can currently edit or delete existing custom actions.
To do so, find your action in My Actions section, click on the menu button on the rightmost of the screen and choose the desired option from the dropdown menu.
In case you are using widgets and Blox scripts please remember:
1. Widget script: executed before the widget is initialized (when you open a dashboard or refresh the page). That's a good place to create widget event handlers, or create parameters that you only need to define once regardless of result sets.
2. BloX script tag: runs every time the BloX widget is rendered and loaded to the screen (includes filters update, screen resizing and anything that triggers redrawing of the BloX widget). This is a good place to execute scripts that should run every time the view is loaded (for example: selecting elements from the DOM and applying different manipulations on them).
