What is an Open Screen Action?
The Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
action opens new screens in PhixFlow. Open Screen actions run once per flow, or once after receiving the final record. This means that if 100 records are passed into the Actionflow, only 1 screen opens after receiving the final record (not 100 screens).
Creating Open Screen Actions
There are several ways to create Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
Actionflows.
Create Actionflow for Existing Screen
Use this method where the screen that requires opening already exists.
- On the screen where the Actionflow will be initiated from, click
Insert excerpt |
---|
| _screen |
---|
| _screen |
---|
nopanel | true |
---|
|
s in the toolbar to open the list of available screens - Drag and drop the required screen from the
Insert excerpt |
---|
| _repository |
---|
| _repository |
---|
nopanel | true |
---|
|
onto the button that will initiate the Actionflow, or drop anywhere and PhixFlow will create the button for you
Create Actionflow and Screen
Use this method to create the Actionflow and screen at the same time.
- On the screen where the Actionflow will be initiated from, right-click on a button and choose
Insert excerpt |
---|
| _actionflow_add |
---|
| _actionflow_add |
---|
nopanel | true |
---|
|
- Or, click Actionflow in the header tabs, then
- On the Actionflow canvas, drag the
Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
icon from the toolbar onto the canvas and follow the steps to create or open an existing screen - Alternatively, click the
Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
icon in the toolbar to display existing screens in the application- Existing screens can be dragged from the
Insert excerpt |
---|
| _repository |
---|
| _repository |
---|
nopanel | true |
---|
|
onto the canvas to automatically create an Open Screen node
Create Actionflow and Screen using CRUD Wizard
A Grid Actions wizard is available to automatically create certain actions on a screen, such as Creating, Reading, Updating and Deleting data. These are referred to as CRUD actions. See Configure Action Buttons on 7. Editing Content on a Screen - Part 1.
Insert excerpt |
---|
| Open Screen Node |
---|
| Open Screen Node |
---|
name | ChangeScreen |
---|
nopanel | true |
---|
|
HTML Comment |
---|
|
Insert excerpt |
---|
| Open Screen Node |
---|
| Open Screen Node |
---|
nopanel | true |
---|
|
|
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, the data and screens have already been pre-loaded into the Actionflow Foundation Application. For this example, we'll be working on configuring buttons on the Course Management screen to open the Course Form screen. |
We want to be able to add and edit courses on a Course Management screen. The first step to doing this is by creating two Open Screen Actionflows. Both will open the same screen containing form fields, but when we are adding a new course we want empty form fields, and when we are editing an existing course, we want the form fields to contain course data.
To save the new or edited course, the Save Action on the Course Form screen must be configured. This is covered in 1.09 Save Action Configuration.
Example 1: Open Screen to Add New Data
Create an Open Screen Action that opens an empty input form.
On thescreen where the Actionflow will be initiated from, Course Management, right-click on the button and choose
Insert excerpt |
---|
| _actionflow_add |
---|
| _actionflow_add |
---|
nopanel | true |
---|
|
Expand |
---|
title | Can't see this option? |
---|
|
Make sure your screen is Insert excerpt |
---|
| _unlock |
---|
| _unlock |
---|
nopanel | true |
---|
| ed.If you cannot see the toolbar across the top of the screen, your screen is ed. Right-click anywhere on the screen and choose Insert excerpt |
---|
| _unlock |
---|
| _unlock |
---|
nopanel | true |
---|
| the Screen. |
- Enter a name for the Actionflow,
- Name:
Add Course
- Select Confirm
- Click the
Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
icon in the toolbar to display the existing screens in your application - Drag your pre-made
Insert excerpt |
---|
| _screen_icon_only |
---|
| _screen_icon_only |
---|
nopanel | true |
---|
|
input form screen, Course Form, from the Repository onto the canvas to create an Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
node Select Click to Connect under Connections and for the input, choose the
Insert excerpt |
---|
| _actionflow_on_click |
---|
| _actionflow_on_click |
---|
nopanel | true |
---|
|
Action Event, then select Connect InputOn the canvas, click and drag the
Insert excerpt |
---|
| _driving_interface_connection_point |
---|
| _driving_interface_connection_point |
---|
name | icon |
---|
nopanel | true |
---|
|
icon onto the Insert excerpt |
---|
| _action_screen_icon |
---|
| _action_screen_icon |
---|
nopanel | true |
---|
|
Open Screen action node to connect the input to the action Expand |
---|
|
|
- Close the Actionflow to return to the screen
- the screen and press the button to see the Actionflow in action
- We can see that the Actionflow is working because it opens an empty form
Tip |
---|
title | Why do we use an On Click input? |
---|
|
An input of On Click means that the Actionflow is initiated by the user clicking a button. We use an input of On Click where an Actionflow does not require any data to run the action. In the exercise above, we are creating an Actionflow that opens a screen where new courses will be created, therefore no data needs to be transferred across to the Course Form screen when it is opened. |
Example 2: Open Screen to Edit Existing Data
Create an Open Screen Action that opens an input form containing data from the school courses grid.
- On thescreen where the Actionflow will be initiated from, Course Management, check it is
Insert excerpt |
---|
| _unlock |
---|
| _unlock |
---|
nopanel | true |
---|
|
ed - Right-click on the button and choose
Insert excerpt |
---|
| _actionflow_add |
---|
| _actionflow_add |
---|
nopanel | true |
---|
|
- Enter a name for the Actionflow,
- Name:
Edit Course
- Select Confirm
- Click the
Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
icon in the toolbar to display the existing screens in your application - Drag your pre-made
Insert excerpt |
---|
| _screen_icon_only |
---|
| _screen_icon_only |
---|
nopanel | true |
---|
|
input form screen, Course Form, from the Repository onto the canvas to create an Open Screen node - Select Click to Connect and for the input, choose the School Courses View Component, then select Connect Input
- The Mappings window will open:
- Drag the CourseID attribute from the left (Grid) into the Drag and Drop space on the right (Connection Point), then click Save
- On the canvas, click and drag the
Insert excerpt |
---|
| _driving_interface_connection_point |
---|
| _driving_interface_connection_point |
---|
name | icon |
---|
nopanel | true |
---|
|
icon onto the Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
action node to connect the input to the action - Right-click the connector between the node and
Insert excerpt |
---|
| _action_screen |
---|
| _action_screen |
---|
nopanel | true |
---|
|
node on the canvas - Choose
Insert excerpt |
---|
| _open_mappings |
---|
| _open_mappings |
---|
nopanel | true |
---|
|
and the Mappings window will open:Drag the CourseID attribute from the left (Actionflow) onto the CourseID attribute on the right (Screen), then click Save
Expand |
---|
|
|
- Close the Actionflow to return to the screen
- the screen and press the button to see the Actionflow in action
- We can see that the Actionflow is working because it displays the data from the School Courses grid in the edit form
Tip |
---|
title | Why do we use a data source input? |
---|
|
A data source input means that the Actionflow requires data to perform the action. In the exercise above, we are creating an Actionflow that opens a screen where existing courses will be edited, therefore data needs to be transferred from the School Courses grid, through the Actionflow and out to the Course Form screen. |