Versions Compared

Key

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

Insert excerpt
_Banners
_Banners
nameactionflow
nopaneltrue

Image Modified Test Your Knowledge

You have now learnt how to create and configure simple Actionflows in PhixFlow. To reinforce the techniques you have learnt, complete these assignments.

tip

Note: A training instance is required to complete these assignments.

Don't worry, this is not an exam.

Use

You can use the Help to broaden your understanding and assimilate knowledge

. A number of hints have been provided; use these if you are struggling as each hint gives you more information on the solution.  

Expand
titleAssignment Hint

Remember to close and reopen your screen if you do not see the changes you expect.


Assignment 1

Difficulty Level: 

Image Removed

MildImage Added

  1. Configure the ability the Students button on the Menu (screen) to open the Student Management screen from the Menu 
    1. Use the Students button or create your own button 
    Configure the ability to save and delete new students using the New Student Form screenSet up Actionflows on  

    1. Expand
      titleHint (Which Action Node?)

      See 1.07 Open Screen Action Configuration


  2. Configure the Save and Delete buttons on the on New Student Form screen  screen to save and delete data in the School Students table

    1. Expand
      titleHint (Which Action Nodes?)

      See 1.09 Save Action Configuration and 1.12 Delete Action Configuration


Assignment 2

Difficulty Level: 

Image RemovedWhen

MediumImage Added

  1. On the Student Management screen, when a new student is created , using the New Student button on the Student Management screen, we want the Intake Year field on the New Student Form screen to be prepopulated with the current year in the format, YYYYYYYY 

    1. Expand
      titleTip Hint 1 (Which Actionflow?)

      Modify the Actionflow on the New Student button on Student Management screen.




    2. Expand
      titleTip 2Hint 2 (How to Show the Current Year)

      Use one of PhixFlow's Functions to retrieve the current year. 

      What type of Action Node can perform a function?




    3. Expand
      titleTip 3Hint 3 (Which Action Node?)

      Use the dateGet function in an Output Attribute in a 

      Insert excerpt
      _action_calculate
      _action_calculate
      nopaneltrue
       action.

      See 1.11 Calculate Action Configuration.



    4. Expand
      titleTip Hint 4 (Helpful Reminders)

      Check your mappings all the way through the Actionflow and remember to map your new Output Attribute onto the IntakeYear field.


  2. When a user tries to save a new student, we want a confirmation screen to appear that allows the save to be confirmed or cancelled
    1. Bonus Task: map in add a static text component to the confirmation screen with the Display Text, "Are you sure you want to create the new student,". In the Actionflow, map the name of the new student onto the dynamic text component, Message

    2. Expand
      titleHint 1 (Which Actionflow?)

      Modify the Save Actionflow on the New Student Form screen.



    3. Expand
      titleHint 2 (Confirmation Screen)

      Create a confirmation screen using the Confirmation template. See 1.13 Confirmation Message Configuration.




    4. Expand
      titleHint 3 (Bonus Task)

      From the palette, add a Header 1 - Static component to the screen and add the Display Text specified above. 

      Within the Confirmation phase of the Save Actionflow, add a 

      Insert excerpt
      _action_calculate
      _action_calculate
      nopaneltrue
       between the input node and the Open Screen node.

      Add an Output Attribute with the Expression:

      Code Block
      themeEmacs
      in.Name

      Map the Output Attribute onto the Message dynamic text component.


  3. Set up the Students grid on the Student Management screen to contain the below icon a button in the Web column and configure this button to that open the student's website when clicked. Use the Action Icon 
    Insert excerpt
    _styles_ccs
    _styles_ccs
    nopaneltrue
    , WebsiteIcon
    1. Web icon: 

    2. Expand
      titleHint 1 (Displaying WebIcon Attribute)

      Unhide the WebIcon attribute by right-clicking the grid and selecting 

      Insert excerpt
      _view_show_config
      _view_show_config
      nopaneltrue
      .

      Note the hidden attribute, Website, this contains the URL. Leave this attribute hidden.



    3. Expand
      titleHint 2 (Creating Actionflow and Icon Style)

      Set up the Actionflow and icon style by clicking the Web header in the grid. In the Properties for the WebIcon View Attribute, click the 

      Insert excerpt
      _property_tabs
      _property_tabs
      nameaction
      nopaneltrue
      .



    4. Expand
      titleHint 3 (Icon Style)

      For the Action Icon Style, click 

      Insert excerpt
      _styles_ccs_list
      _styles_ccs_list
      nopaneltrue
       to see the preconfigured styles in the app. Drag the WebsiteIcon style into the Action Icon Style box on the 
      Insert excerpt
      _property_tabs
      _property_tabs
      nameaction
      nopaneltrue
      , or you can create your own style using the WWWIcon.



    5. Expand
      titleHint 4 (Actionflow)

      This Actionflow is the same as the one setup in 1.14 Open URL Action Configuration, except the Expression for the Output Attribute is:

      Code Block
      themeEmacs
      in.Address



Assignment 3

Difficulty Level: 

Image Removed

HotImage Added

  1. When a new student is created on the New Student Form screen, we want the form to contain validation. Create a new validation rule stipulating:
    1. the Name field must be populatedfield is mandatory
    2. the Name field must contain at least 3 characters
    3. the Name field must adhere to the pattern, ^[A-Za-z\s-]+$

    4. Expand
      titleHint 1 (How to set validation)

      Remember validation is setup on the inner input field.



    5. Expand
      titleHint 2 (Mandatory)

      Setting a field as mandatory is configured using the tick box and toggle button in the Validation section of the Properties tab.



    6. Expand
      titleHint 3 (New Validation Type)

      Create a new validation type with the following settings:

      Base Type: String

      Minimum Length: 3

      Pattern: ^[A-Za-z\s-]+$


  2. We want to see a list of the courses that each student is enrolled on. Set up a button, using a lookup, on the Student Management screen that opens the Courses Enrolled screen with this information onon 
  3. We want the status of a course to be dynamically updated to On Hold if the associated classroom's status is changed to Unavailable (use drop down, define the statuses)
    1. Use the Classroom Availability screen to change the classroom status status  


HTML Comment
hiddentrue

Assignment 2

Configure the Student Management button in the menu

Difficulty Level: Image Modified

  1. On the Course Management screen open the
    Insert excerpt
    _layers
    _layers
    nopaneltrue
     and expand the area, Screen Header
  2. Expand the area, Right, and you will see two components - a button and a dynamic text field
  3. Create an Actionflow on the button that uses the now function to insert today's date into a dynamic text field


HTML Comment
hiddentrue

Assignment #: Configure a button, that when pressed, shows today's date

Difficulty Level: 

  1. On the Course Management screen open the
    Insert excerpt
    _layers
    _layers
    nopaneltrue
     and expand the area, Screen Header
  2. Expand the area, Right, and you will see two components - a button and a dynamic text field
  3. Create an Actionflow on the button that uses the now function to insert today's date into a dynamic text field


Expand
titleQuestions to consider
  • Does this Actionflow require any data from the Course Management screen for it to run?
  • What type of Action Node can perform a function?
  • How do you write the results of the function to the text field on the screen?


Expand
titleHelpful Hints & Answers to the Above Questions
  • No data is required for the input
  • Use a Calculate Action to perform the function
  • You will need a create an output to write to the text field
    • The top level of the screen is called a Form
  • Remember to map all the way through the Actionflow
    • Check every connector to make sure the data you expect is being pushed through


Expand
titleReveal Answer


Expand
titleInput & Action Node Setup

Setup the Input and Calculate Action

Description?

  1. Right-click on the button on the screen and choose 
    Insert excerpt
    _actionflow_add
    _actionflow_add
    nopaneltrue
  2. Enter a name for the Actionflow,
    1. Name: Populate Date Field
    2. Select Confirm
  3. Select Click to Connect and for the input, choose the 
    Insert excerpt
    _actionflow_on_click
    _actionflow_on_click
    nopaneltrue
     Action Event, then select Connect Input
  4. Click and drag the 
    Insert excerpt
    _action_calculate
    _action_calculate
    nopaneltrue
     icon from the toolbar onto the canvas
  5. Enter a name for the Calculate Action and select Create Action 
  6. The 
    Insert excerpt
    _property_tabs
    _property_tabs
    nopaneltrue
     for the Calculate Action will open on the right
  7. In the Output Attributes section, click the 
    Insert excerpt
    _add_icon
    _add_icon
    nopaneltrue
     icon
  8. Enter a name for the new Output Attribute and complete the following details:
    1. Type: choose String
    2. Expression: 

      Code Block
      now()


    3. Then 
      Insert excerpt
      _finish
      _finish
      nopaneltrue
  9. Click and drag the input onto the Get Date Calculate Action


Expand
titleOutput Setup

Setup the Output and Write Back to the Screen

DESCRIPTION?

  1. In the Connections panel on the left, click
    Insert excerpt
    _addIcon
    _addIcon
    nopaneltrue
     Add to create a new connection point
  2. Enter the following details for the new connection point:
    1. Name: out
    2. Type: choose Output
    3. Select Create Connection Point
  3. Select Click to Connect and for the output, choose the 
    Insert excerpt
    _form
    _form
    nopaneltrue
     datasource
    1. Select Connect Output
  4. Close the Mappings window that automatically opens
  5. Hover over the Calculate Action node and select out
  6. A red arrow will appear - click on the
    Insert excerpt
    _output
    _output
    nameicon
    nopaneltrue
     output node under Connections
  7. On the Mappings window, drag the attribute, TodayDate, from the left (Calculate Action) to the right (output connection point) to create an attribute on the output
    1. Select Save
  8. Under Connections, right-click on the connector, out, and choose
    Insert excerpt
    _mappings_configure
    _mappings_configure
    nopaneltrue
  9. Drag the TodayDate attribute from the left (output connection point) and drop it onto the DateField target parameter on the right (Course Management screen)
    1. Select Save
  10. Close the Actionflow to return to the Course Management screen
  11. Insert excerpt
    _lock
    _lock
    nopaneltrue
     the screen and press the Button Date on the screen to see the Actionflow in action
    1. We can see that the Actionflow is working because it displays today's date in the format DD/MM/YY in the DateField dynamic text field