18. Actions and Initiators

Owned by Anthony George
Last updated: Feb 08, 2023
5 min read


Introduction

Actions allow users to interact with the screens and data on them. There are many ways actions can be triggered in this chapter we will look at buttons, double-clicks and drag and drop.

Buttons

We have set up a number of buttons on this course. Actions are associated with a button in their Properties → Action tab. For more information on setting up actions see: Understanding Actionflows.

Double-Click

We can set a default action on a grid of data, or a card container, so that when a user double-clicks on a record the action is triggered. To apply an action to double-click on a grid:

  1. Open your screen with the grid the action should be applied to. For this example, we will use the Companies List screen.
  2. Right-click on the grid and select Show the View Configuration.
    1. Make sure the screen is unlocked.
  3. In the properties click, the Actions tab. This is where we set up our double-click response.
    1. The Double Click Action is set to actionflow. This is what you will use unless you have been using an older version of PhixFlow.
    2. Actionflow, this is where we select the actionflow we want to use: 
      1.  Actionflow will open a list of available actions.
      2.  enables you to add a new actionflow.
    3. For our example, we will not make any changes here.

Drag and Drop Concept

We can set up a screen so that items can be dragged and dropped on an area which then triggers an action. For example, we could drag an employee onto a company record and have PhixFlow run an actionflow which updates the company an employee works for.

Drag and Drop works by defining:

  1. Drag Types, specifies the type of item being dragged. We specify attributes that are being dragged and map these to attributes in the data. 
  2. Drop Handlers, specify which drag types can be dropped on a specific item. Drop handlers are responsible for triggering the action associated to the drag type and drop handler combination. Drag types are associated with specific drop handlers to ensure we only trigger the required actionflow. A drop handler can have multiple drag types associated with it.


Drag types and drop targets are applied to data containers, such as grids, card containers and areas. Items that get dragged inherit the drag type from the container they come from. For example, a row in a grid can be dragged and will have the drag type associated with the grid it originated from. The same is true for drop targets, while we drop on a specific item such as a row in a grid, the drop target is specified on the container.


The following image illustrates the configuration at a conceptual level:

Drag and Drop Setup

We will create a drag and drop configuration in our application where we drag an employee onto a company and this will trigger an actionflow that updates the employee with a new employer (company). As illustrated below:

  1. Open the Companies List screen.
    1.  Unlock it so it's editable.
  2. Drag Type
    1. Click on the Employees Card Container.
    2. In the properties click the Actions tab.
    3. Next to Drag Type click 
      1. Name, EmployeeDrag.
      2. Click  Save. This is necessary as it creates the drag type so we we can add attributes.
      3. In the Attributes section click .
        1. Name, EmployeeID
          1. This can be any name, it is just a placeholder to be mapped to. This allows us to reuse the drag type on another item and simply map the appropriate attribute into these placeholders.
        2. Type, Integer.
        3.  Save your changes.
      4. Close the Drag Type repository pane.
    4. On the Employee Card Container, click the  Add Mapping button.
      1. Drag EmployeeID from the left onto EmployeeID on the right. This is associating the EmployeeID from our Employee card container with the EmployeeID attribute placeholder on our drag type. 
      2. Click Confirm Mappings.
    5.  Save your changes.
    6. The setup should look like the following. Here the mapping screen has been left open for reference. Click on the image to enlarge it if necessary:
      1.  
    7. The drag type is set up.
  3. Drop Target
    1. On the Companies grid, right-click and select Show the View Configuration.
      1. Action settings are placed on the view rather backing the grid.
    2. In the Actions tab click in the Drop Targets section:
      1. Name, EmployeeDrop
      2. Drag Type, EmployeeDrag
      3. Drop Action, Actionflow
      4.  Save your changes.
      5. Actionflow, click 
        1. Name, Employee Changer.
          1. Note: The employee record we are dragging is the driving data so we send this in and then lookup the detail of the company we are dropping on.
        2. In the Connections section, click the Connect box.
        3. From the dialogue that pops up select EmployeeDrag and click Connect Inputs.
        4. In the Mapping dialogue drag EmployeeID to the right.
          1. Actionflows are a topic in themselves and beyond the scope of this course. For more information on Actionflows see Understanding Actionflows.
        5. Click Confirm Mappings.
        6. Still in the connections, click 
          1. Name, Company.
          2. Type, Lookup.
          3. Click Create a Connection Point.
        7. From the dialogue that opens, click EmployeeDrop. This is the company record we are dropping on. This provides us access to its information in the lookup.
        8. Click Connect Input.
        9. The Mapping screen opens, drag CompanyID from the left (this is the data we are dropping on) to the area on the right to create an incoming attribute returned by the lookup.
        10. Click Confirm Mappings.
        11. The correct data is now coming into the actionflow. Now we need to use it in the actionflow.
        12. From the Actionflow Toolbar, drag a Calculate action onto the actionflow.
          1. Name, CompanyData.
        13. Connect and the Input Connection Points to the Calculate action as illustrated here:
        14. Click on the Calculate action, in the properties, in the Calculate Attributes section, click : 
          1. Name, NewCompanyID.
          2. Type, Integer.
          3. Expression, lu.CompanyID.
            1. This is referencing the attribute CompanyID coming in from the pipe called lu.
          4.  Save your changes.
          5. We will use this new CompanyID when we update the employee.
        15. From the Actionflow toolbar, drag a Save action onto the actionflow. Enter the following details and click Create Action:

        16. Connect the Calculate action to the new Save action, and set up the mappings as follows, click the image to enlarge it:
        17. Ensure all your property tabs have been saved.
  4. Testing
    1. Close the Companies List screen and reopen it to refresh the drag and drop handlers.
    2. Switch to  Application Mode.
    3. Now you will be able to drag employees onto a new company as illustrated here: