Event Action

Block Information

Available in: Page Flow

Toolbox Category: Action - Event

Block Type: Regular

Use the Event Action block to take an action when the user interacts with elements on a page or form.

This block can be considered a more generic version of the Mouse/Keyboard Action block, where you can handle and take an action on any event, not just the Clicked, Double-Clicked, Right-Clicked and Key Pressed events.

The block comes in two modes which are discussed below.

Mode 1

Event Action block (Mode 1)

The Mode 1 version of the Event Action block consists of the following (from left to right, top to bottom):

Mode 2

Event Action block (Mode 2)

The Mode 2 version of the Event Action block consists of the following (from left to right, top to bottom):

  • Event Name: Value Parameter that accepts a text value representing the name of the event you want to handle and take an action on. See the Event names section for more details.

  • Element: Value Parameter that accepts either a text value in the form of a CSS Selector or an element value. The Element block comes pre-attached for your convenience but can be removed and customized.

  • Tasks: a Flow Parameter where you connect blocks that specify what you want done when the event occurs. Use the Action/Event Info block to get more information about the event.


Event names

Some of the common event names are given below:

Event Name
Description

click

Mouse click on the selected element

contextmenu

Mouse right-click on the selected element

dblclk

Mouse double-click on the selected element

change

Changes to the selection of a Dropdown element

keypress

Key press when the selected element is in focus

blur

Selected element looses focus

focus

Selected element gains focus

For a more comprehensive list of event names please refer to:


Usage Examples

The image below shows an example of the Event Action block (Mode 1) where the Show Information Popup block is used to show a message when the selected button is clicked. This is an exact equivalent of the example shown in the Mouse/Keyboard action block.

Example of Event Action block (Mode 1)

The next image (below) shows an example of the Event Action block (Mode 2). Here the click event is handled and the button's state is set to disabled along with the appending of a status spinner to show that the app is processing some task.

Example of Event Action block (Mode 2)

Last updated