Versions Compared

Old Version 6

changes.mady.by.user Fiona Sargeant

Saved on

compared with

New Version 7

changes.mady.by.user Fiona Sargeant

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

This page is for application designers. It explains how to set up actions in response to an event, such as a user mouse-click.todo-Fiona - Indraft: Layout component also needs updating as there is a new properties section

Overview

Often in an application, you want to trigger an action based on an event that occurs on the dashboard:on the user:

  • either mouse-clicking on the dashboard
  • or pressing the enter key.

These user interactions are called events. PhixFlow has the following event handlers that you can connect to a stream-action or actionflow. When the user triggers the event, PhixFlow runs the stream-action or actionflow.

  • OnClick: the user mouse clicks in an area or on a button.
  • OnEnter: the user presses the Enter key in a data field.
  • OnBlur: the user moves their mouse pointer -clicks out of a data field.
    The event is triggered whether or not the field has changed.
  • OnChange: the user moves their mouse pointer -clicks out of a data field in which they have changed data.
    Notice that this event is not triggered by the user typing into a field.
You configure an event handler on a specific layout component, and link it to a stream-action or actionflow. When the user triggers the event, PhixFlow runs the stream-action or actionflow
  • .

You can set event handlers on the following components:

EventSupported components
OnClickAreas
ButtonsArea
OnChange

AreasArea

Buttons
Data fields:

  • Boolean
  • Date
  • Datetime
  • Number
  • String
OnBlur OnEnter

Data fields:

  • Boolean
  • Date
  • Datetime
  • Number
  • String


Tip

You do not have to configure OnClick events for button components, because button actions are always triggered when the user mouse-clicks on them.


Live Search
spaceKey@self
additionalnone
placeholderSearch all help pages
typepage

Panel
borderColor#7da054#00374F
titleColorwhite
titleBGColor#7da054#00374F
borderStylesolid
titleSections on this page

Table of Contents
maxLevel3
indent12px
stylenone


Adding an Event Handler

  1. From the screen, open the componentclick on a component to open its properties.
  2. In the Event Handler section, click 
    Insert excerpt
    _Add
    _Add
    nopaneltrue
     to create a new event handler.
  3. In the new event handler tab, select the Action Method.
  4. Open the repository to find the action you require.
  5. Drag the action from the repository to the Action field, 

Add to component

Action method

  • Stream Action
  • No action
    • Workflow Action
    1. PhixFlow opens a new properties tab for the event handler.
    2. Select the Event Type, Action Method and specific stream-action or actionflow you require; see the properties below.


    Event Handler Properties

    Basic Settings

    FieldDescription
    Event Type

    Select the type of event that will trigger an action:

    • OnClick
    • OnEnter
    • OnBlur
    • OnChange.

    The list shows only the events available for this type of component.

    Action Method

    Available when Event Type is selected.

    Select the type of action:

    • Stream Action
    • No action
    • Actionflow
    Action

    Available when Action Method is Stream Action.

    • Either, select a stream-action from the drop-down list
    • Or, to find stream-actions belonging to a specific stream:
      1. Click 
        Insert excerpt
        _table_list
        _table_list
        nopaneltrue
         to show streams in the repository
      2. Expand the stream
      3. Drag a stream-action from the list into this box.
    Actionflow

    Available when Action Method is Actionflow.

    To select an actionflow, do one of the following:

    • Select an actionflow from the drop-down list.
    • Click 
      Insert excerpt
      _actionflow
      _actionflow
      nopaneltrue
       to show actionflows in the repository
    • Click 
      Insert excerpt
      _add
      _add
       to create a new actionflow; see Actionflows.