Overview

When creating an application, you can configure Actionflows to respond to different events, such as a mouse click, double click or enter key press.

Event Handlers & Action Settings

An Event Handler is an action that responds to a specific event, such as a mouse click, double click or enter key press. The Event Handler defines how the application behaves when the event is triggered, such as running an Actionflow.

Multiple event handlers can be set on the same component or field. For example, you may wish for a validation Actionflow to be triggered On Enter and On Blur.

Event/Action	Description	Component	Data Field
		Set Events/Actions on:
On Click	The user mouse clicks in an area.	Area	-
On Change	A toggle field changes state or the user mouse-clicks out of a data field in which they have changed data. Note: This event is not triggered by the user typing into a field.	-	Boolean Date Datetime Number String
On Enter	The user presses the Enter key in a data field.	-
On Blur	The user mouse-clicks out of a data field. Note: This event is triggered whether or not the data in the field has been changed.	-
Double Click	The user double clicks in a grid.	View
Auto Save	The user changes data in a grid, then clicks out of the cell.	View
Drag Types & Drop Targets	User drags an item from one part of a screen, and dropping on another part.	View Kanban Area
Task Plan	The user starts a task plan or a task plan auto-starts according to its schedule.
On Startup	The user loads the application.
Actionflow	Set a double click action that will override any default double-click action set on the View.	View Component

On Click events are automatically set on button components.

Adding an Event Handler

From a screen, click on a component or field to open its Properties tab
Click on the Actions tab and in the Event Handler section, click the icon to create a new event handler
In the New Event Handler Properties, select an Event Type

Only events available for this type of component will show - see Event Types table above.
For Action Method, select Actionflow, then click the icon to create a new Actionflow or click the icon to display a list of available Actionflows

Adding Action Settings

From a screen, right-click on a grid and press Show the View Configuration
On the View's Properties, click on the Actions tab
In the Action Settings section, under Double Click Action, select Actionflow
Click the icon to create a new Actionflow or click the icon to display a list of available Actionflows

Worked Examples

Here are worked examples using the Retail Data (available from the Learning Centre).

In this example, we are using:

A Shop Stock screen containing a grid of the Shop Stock data, a pie chart of the Shop Stock data and a grid of the Shop Departments data - this screen was created using the Multi-Tile template
A Shop Statistics screen containing 4 tiles with charts and graphs of the Shop Stock data - this screen was created using the Tile no Buttons template
A Shop Customer Form screen containing form fields and associated with Shop Customers data by a background filter - this screen was created using the Edit Form template

If you are completing this chapter as part of the Actionflow course and using a training instance, the data and screens have already been pre-loaded into the Actionflow Intermediate Application. For this example, we'll be working on configuring events on:

the Shop Stock screen to open the Shop Statistics screen
the Shop Customer Form to display a specified text string

Example 1: Configuring an On Click Event

In this example, we'll set up an Actionflow to open a screen when an area is clicked.

On the screen where the Actionflow will be initiated from, Shop Stock, find the area, Split Area Top (use the search in the Layers)
Click on the area to open its properties
On the Actions tab, in the Event Handler section, click the to create a new event handler:
1. Event Type: select On Click
2. Action Method: choose Actionflow
3. Click Apply
4. Click the icon to create a new Actionflow
  1. Name: Open Shop Stock Statistics
5. Click Apply on the Split Area Top area properties
6. On the Actionflow, select Click to Connect and choose an input of On Click
7. Create an Open Screen Actionflow that opens the Shop Stock Statistics screen
  1. See 1.07 Open Screen Action Configuration
    Checkpoint
8. Close the Actionflow and Apply and Close the new event handler properties
On the Split Area Top area properties, click the Styles tab
In the Style Settings section, tick Cursor and set this to Pointer (hand pointing)
1. This indicates to your application users that this area is clickable
Apply and Close the area properties
Lock the screen and click the area to see the Actionflow in action

Example 2: Configuring an On Change Event

In this example, we'll set up an Actionflow to display a dynamic text string when a boolean field's state is changed (from false to true).

On the screen where the Actionflow will be initiated from, Shop Customer Form, find the True/False Field, mailingList (use the Layers)
Click the field to open its properties
On the Actions tab, in the Event Handler section, click the to create a new event handler:
1. Event Type: select On Change
2. Action Method: choose Actionflow
3. Click Apply
4. Click the icon to create a new Actionflow
On the Actionflow, select Click to Connect and choose an input of On Change
Using a Calculate Action, create an Output Attribute containing the following string:
```
"Inform the customer that they will receive weekly emails with news and offers." 
```
See 1.11 Calculate Action Configuration
Create an Output Connection Point back to the Shop Customer Form screen
Drag the input node onto the Calculate action
Drag the output node onto the Calculate action
Map your new Output Attribute onto the dynamic text component, checkEmailText
1. Remember to map this both on the output connector on the canvas, and on the output connection point under Connections
  Checkpoint
Close the Actionflow and Apply and Close the new event handler properties
Apply and Close the True/False Field properties
To test the Actionflow, close and reopen the screen, ensuring it is Locked
1. Populate the First Name and Last Name fields as these are mandatory fields and will show an error message if not populated
Click the 'Would the customer like to join the mailing list?' toggle to see the Actionflow in action

HELP11

Connecting Actionflows to Events