By the end of this chapter you will understand what a Calculate action is and how to use them, and you will have created three Calculate Actionflows in your application.
What is a Calculate Action?
The Insert excerpt |
---|
| _action_calculate |
---|
| _action_calculate |
---|
nopanel | true |
---|
|
action manipulates and processes data. Calculate nodes have their own attributes, which can reference incoming data via expressions, using one or more of the 135+ Functions available in PhixFlow.
For the full list of Calculate Action Insert excerpt |
---|
| _property_settings |
---|
| _property_settings |
---|
nopanel | true |
---|
|
, see Calculate Action Properties.
Creating Calculate Actions
We want to be able to filter the records that can be seen in our School Courses grid. To do this, we will create three Calculate Actionflows. Each Actionflow will populate a string field with a string of text. That text will then be interpreted by a background filter to see if it matches any records for the specified attributes, and will filter the grid accordingly.
Calculate Actions to Initiate Filters
- Open the Course Management screen where the Actionflow will be initiated from
- The Filters panel on the left of the screen contains a number of buttons which we will set up so when they are pressed, the School Courses grid is filtered:
- All: This will reset the grid to show all records
- Maths: This will show only records where the department name is Mathematics
- English: This will show only records where the department name is English
Reset Filter
Right-click on the Image Removed button - Click and drag the
Insert excerpt |
---|
| _action_calculate |
---|
| _action_calculate |
---|
nopanel | true |
---|
|
icon from the toolbar onto the canvas - Enter a name for the Calculate action, then select Create Action
- In the Calculate Action
Insert excerpt |
---|
| _property_settings |
---|
| _property_settings |
---|
nopanel | true |
---|
|
on the right, click the Insert excerpt |
---|
| _add_icon |
---|
| _add_icon |
---|
nopanel | true |
---|
|
icon in the Output Attributes section to add new attributes
HTML Comment |
---|
|
Insert excerpt |
---|
| Calculate Action Properties |
---|
| Calculate Action Properties |
---|
nopanel | true |
---|
|
|
Tip |
---|
Calculate actions and their connection points, can have an attribute type of Structured Data. Use this if you need the Actionflow to pass a list (an array of values). |
Example Uses
Calculate Actions can be used for:
- Inserting static text strings, e.g. when inserting a new record set a value of "New" in a status field
- Modifying dynamic text components
- Calculating values using Functions, e.g. Calculating the amount of VAT on a customer invoice
- Performing lookups against a View action node or lookup connection point, e.g. counting records in a grid or retrieving details of all students on a course
Worked Examples
Here's a worked example using the School Data (available from the Learning Centre).
In this example, we are using:
- A Course Management screen containing a grid of the School Courses data - this screen was created using the Tile with Buttons template
- A Course Form screen containing form fields and associated with School Courses data by a background filter - this screen was created using the Edit Form template
Tip |
---|
If you are completing this chapter as part of the Actionflow course and using a training instance, this data has already been pre-loaded into the Actionflow Foundation Application. For this example, we'll be working on buttons on the Course Management screen and the Course Form screen. |
Example 1: Use a Calculate Action to Add Static Text
We want to add a message, "Create New Course", to the Course Form header that shows only when a new course is being created. To do this, we will add a Calculate Action to the Open Screen Actionflow for adding a new course.
Image Added
- On the screen where the Actionflow will be initiated from, Course Management, right-click on the Image Added button on the School Courses grid and choose
Insert excerpt |
---|
| _actionflow_adddisplay |
---|
| _actionflow_adddisplay |
---|
nopanel | true |
---|
|
- Enter a name for the Actionflow:
- Name:
All Filter
- Connect the filter button by selecting Click to Connect
- For the input, choose the On Click Action Event, then select Connect InputIf there is no Actionflow to display, see Open Screen Action Configuration
- Click and drag the
Insert excerpt |
---|
| _action_calculate |
---|
| _action_calculate |
---|
nopanel | true |
---|
|
icon from the toolbar onto the canvas - Enter a name for the Calculate actionAction:
- Name:
Reset Filter
Course Header
- Select Create Action
Click and drag the - Action
- The
Insert excerpt |
---|
| _drivingproperty_interfacetabs |
---|
| _connection_point | _driving_interface_connection_point | name | iconproperty_tabs |
---|
nopanel | true |
---|
|
for the Calculate Action will open on the right- If the
Insert excerpt |
---|
| _property_tabs |
---|
| _property_tabs |
---|
nopanel | true |
---|
|
icon onto the Reset Filter node to connect the input to the actionClick on the Reset Filter node to open its Properties on the right- is not open, click the Calculate Action node on the canvas
- In the Output Attributes section, click the
Insert excerpt |
---|
| _add_icon |
---|
| _add_icon |
---|
nopanel | true |
---|
|
icon - Enter the following details for the new Output Attribute:
- Name:
pfDept
NewCourse
- Type: choose String
Expression:
Code Block |
---|
|
"AllCreate New Course" |
- Then
Insert excerpt |
---|
| _finish |
---|
| _finish |
---|
nopanel | true |
---|
|
Under Connections, click Insert excerpt |
---|
_addIcon | _addIcon | nopanel | true |
Add - In the Add Connection Point window, enter:
- Name:
Out
- Type: choose
Output
- Select Create Connection Point
- Click on Click to Connect
- In the Connect Output window, choose the Course Management form and select Connect Output
- Close the Mappings window that opens
- Hover over the Reset Filter calculate node on the canvas and select out
- A red arrow will attach to your mouse, click on the Drag and drop the Course Header Calculate Action onto the connector between the input node and the Open Course Form Action
- Image Added
- Right-click on the connector between the Course Header Calculate Action and the Open Course Form Open Screen Action and choose
Insert excerpt |
---|
| _open_outputmappings |
---|
| _open_output | namemappings |
---|
icon | nopanel | true |
---|
|
icon under Connections - The On the Mappings window will open:
- Drag across the Output Attribute, pfDept, into the area on the right to create a corresponding attribute on the output connection point
- Press Save
- Right-click the Out wire, under Connections, and choose Configure Mappings
- The Mappings window will open:
- Select Map by Name
- Press Save
- , drag the NewCourse attribute onto the Header1Dynamic attribute to create the mapping
- Press Save
- Image Added
- Close the Actionflow to return to the Course Management screen
- Lock the the screen and press the Image Removed button Image Added button to see the Actionflow in action
- We can see that the Actionflow is working because it displays the string, All, in the pfDept String field and all records display in the grid
Tip |
---|
|
There are also Background Filters working in tandem with the string field to filter the results in the grid. The Actionflow we created above populates the string field, pfDept. The Background Filters that have already been set up on the grid look inside the string field, then change the records you can see on the grid according to what it finds in the string field. This important to know for debugging, as if the spelling of the string in the expression of the Output Attribute in the Actionflow does not match the string in the background filter, the filter button will not work. To see the setup of the Background Filters, click on the School Courses grid, then in the Properties tab on the right there is a Background Filters section. Double-click on the filters to open them and spend some time looking at these to understand how they work. |
Maths Filter
Have a go at creating the Actionflow for the Image Removed button, with some guidance below.- Create New Course, in place of the original heading on the Course Form
In this example, we will add a Calculate Action that performs the function, toUpper, to a Save Actionflow. This function will format the course name on the Course Management screen into upper case, when the course is added/edited.
Image Added
- On the Course Management screen, click the Image Added or Image Added button to open the Course Form
- Right-click on the Image RemovedImage Added button and choose select
Insert excerpt |
---|
| _actionflow_adddisplay |
---|
| _actionflow_add_display |
---|
nopanel | true |
---|
|
- Click and drag the
Insert excerpt |
---|
| _action_calculate |
---|
| _action_calculate |
---|
nopanel | true |
---|
|
icon from the toolbar onto the canvas - Enter a name for the ActionflowCalculate Action:
- Name:
Maths Filter
Repeat the same steps as with the All Filter, but make the following changes:- Name the Calculate Action:
Maths Filter
When creating a new Output Attribute, the following expression should be used:
Tip |
---|
title | Why do we use "Mathematics" and not "Maths"? |
---|
|
We use "Mathematics" because this is the spelling of the Department Name in our data (you can see this on the School Courses grid), therefore the Background Filter is looking to match up the text in the string field with the data name. Where it gets a match, it will filter the grid accordingly. If we use a different spelling or shortening, the filter will not work as expected. UppercaseName
- Select Create Action
- Right-click on the input connection point under Connections and choose
Insert excerpt |
---|
| _mappings_configure |
---|
| _mappings_configure |
---|
nopanel | true |
---|
|
- On the Mappings window, drag the attribute, Name, from the left (Course Form) into the Drag and Drop space on the right (input connection point)
- Select Save
- On the canvas, drag the UppercaseName Calculate Action node onto the in connector between the node and the
Insert excerpt |
---|
| _save_icon |
---|
| _save_icon |
---|
nopanel | true |
---|
|
SaveCourse node and drop it when the Insert excerpt |
---|
| _add_icon |
---|
| _add_icon |
---|
nopanel | true |
---|
|
icon appears - Right-click on the in connector between the node and the
Insert excerpt |
---|
| _actionflow_calculate |
---|
| _actionflow_calculate |
---|
nopanel | true |
---|
|
and select Insert excerpt |
---|
| _open_mappings |
---|
| _open_mappings |
---|
nopanel | true |
---|
|
On the Mappings window, drag the Name attribute from the left to the right (calculate action)
Tip |
---|
We only need to map the Name attribute here because it is used within the Calculate Action. The CourseID attribute will pass through the Calculate Action and can be used later on in the Actionflow. |
- Select Save
Checkpoint
Image AddedSetup the Calculate Action
- Select the Calculate Action, UppercaseName, to open its
Insert excerpt |
---|
| _property_settings |
---|
| _property_settings |
---|
nopanel | true |
---|
|
- In the Output Attributes section, click the
Insert excerpt |
---|
| _addIcon |
---|
| _addIcon |
---|
nopanel | true |
---|
|
to create a new attribute:- Name:
UpperName
- Type: choose String
Expression:
Code Block |
---|
|
toUpper(in.Name) |
Click
Insert excerpt |
---|
| _finish |
---|
| _finish |
---|
nopanel | true |
---|
|
- Right-click on the in connector between the
Insert excerpt |
---|
| _actionflow_calculate |
---|
| _actionflow_calculate |
---|
nopanel | true |
---|
|
action node and the Insert excerpt |
---|
| _action_save |
---|
| _action_save |
---|
nopanel | true |
---|
|
action node, and select Insert excerpt |
---|
| _open_mappings |
---|
| _open_mappings |
---|
nopanel | true |
---|
|
- On the Mappings window, drag the attribute, UpperName, from the Calculate Action (left) onto the Name attribute on the Save Action (right)
Press Save
Checkpoint
Image Added
- Close the Actionflow to return to the Course Management screenLock the screen and press the Image Removed button Form
- Ensure the screen is ed, then add or edit the course details and press the Image Added button to see the Actionflow in action
- We You can see that the Actionflow is working because it displays the string, Mathematics, in the pfDept String field and just the matching records display in the grid
English Filter
Use the knowledge you have acquired throughout this chapter to independently create the Actionflow for the English filter.
Expand |
---|
|
Repeat the same steps as you did to set up the All and Maths filters, but swap in "English" instead.- the Name for the course you just added/edited is now in capital letters on the Course Management screen
Image Modified