By the end of this chapter you will understand what an Open Screen action is and how to use them, and you will have created an Open Screen Actionflow in your application.

What is an Open Screen Action?

The 

Creating Open Screen Actions

How do you add them (toolbar click and drag, or drag from toolbar), 

Add excerpt to properties page in hidden area

1. Click the 

   Insert excerpt
   _action_screen _action_screen nopanel true

    icon in the toolbar to display any existing screens in the application
   1. Existing screens can be dragged from the Repository onto the canvas to create an Open Screen node
2. Alternatively, 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

Data for Worked Example

Here's a worked example using the school course data.the School Data (available from the Learning Centre).

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 Application.

Worked Example

We want to be able to add and edit the courses in our the School Courses grid on the Course Management screen. To do this, we will create two Open Screen Actionflows. Both will open the same screen but when we are adding a new course, we want an empty input form, and when we are editing an existing course, we want the input form to contain course data.

Note: When creating a new screen in PhixFlow there is a Grid Actions wizard that will configure the Create, Read, Update and Delete (CRUD) actions for you. For the purposes of understanding the mechanics of Actionflows, we will create these manually.

Open Screen to Add New Data

1. Open On the Course Management screen, where the Actionflow will be initiated fromRight, right-click on the button and choose 

   Insert excerpt
   _actionflow_add _actionflow_add nopanel true

2. Enter a name for the actionActionflow,
   1. Name: Add Course
3. Click the 

   Insert excerpt
   _action_screen _action_screen nopanel true

    icon in the toolbar to display the existing screens in your application
4. Drag the Course Form screen from the Repository onto the canvas to create an Open Screen nodeAlternatively, drag the an 

   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 screenConnect the Open Screen node to the Image Removedbutton by selecting  node

5. Select Click to Connect

   For

   and for the input, choose the 

   On Click

   Insert excerpt
   _actionflow_on_click _actionflow_on_click nopanel true

    Action Event, then select Connect Input

6. Click and drag the 

   Insert excerpt
   _driving_interface_connection_point _driving_interface_connection_point name icon nopanel true

    icon onto the Open the 

   Insert excerpt
   _action_screen _action_screen nopanel true

    Course Form node to connect the input to the action
7. Close the Actionflow to return to the Course Management screenLock the

8. Insert excerpt
   _lock _lock nopanel true

    the screen and press the  button to see the Actionflow in action
   1. We can see that the Actionflow is working because it displays opens an empty form

Open Screen to Edit Existing Data

1. On the Course Management screen, where the Actionflow will be initiated from, right-click on the  button and choose 

   Insert excerpt
   _actionflow_add _actionflow_add nopanel true

2. Enter a name for the actionActionflow,
   1. Name: Edit Course
3. Click the 

   Insert excerpt
   _action_screen _action_screen nopanel true

    icon in the toolbar to display the existing screens in your application
4. Drag the Course Form screen from the Repository onto the canvas to create an Open Screen nodeAlternatively, drag the 
5. Insert excerpt_action_screen_action_screennopaneltrue icon from the toolbar onto the canvas and follow the steps to create or open an existing screenConnect the Open Screen node to the Image Removed button by selecting Select Click to Connect For and for the input, choose the School_Courses View Component, then select Connect Input
6. The Mappings window will open:
   1. Drag the CourseID attribute from the left (Tile BodyGrid) to the right (Edit CourseConnection Point Interface), then click Save
   2. 
7. Click and drag the 

   Insert excerpt
   _driving_interface_connection_point _driving_interface_connection_point name icon nopanel true

    icon onto the Open Course Form node to connect the input to the action
8. Right-click the connection wire connector between the input node and Open Screen node

   Insert excerpt
   _input _input nopanel true

    node and

   Insert excerpt
   _action_screen _action_screen nopanel true

    node on the canvas
9. Choose Open Mappings and

   Insert excerpt
   _open_mappings _open_mappings nopanel true

    and the Mappings window will open:
   1. Drag the CourseID attribute from the left (Edit CourseActionflow) to the right (Open Course FormScreen), then click Save
10. Close the Actionflow to return to the Course Management screen
11. Lock the

    Insert excerpt
    _lock _lock nopanel true

     the screen and press the button to see the Actionflow in action
    1. We can see that the Actionflow is working because it displays the data from the School Courses grid to in the edit form