Variable source

This example demonstrates how to set up dependencies between controls in a user step to affect the data output shown to the End-user.

The example is based on the source being a variable.

Ensure that Allow Dependencies is set to true for the user step. The user step must allow dependencies for this functionality to work properly.

Create an App with steps and input data

1. Create a new Application in an Application package and open it in the Designer.

2. Create a User step and bind it to the start step with a sequence arrow.

3. Create a Script step and add a data arrow to the user step.

4. Add the following script to the script step and set its target variable to categories.

let pens = [{name: "Red pen"}, {name: "Green pen"}, {name: "Blue pen"}];
let papers = [{name: "Paper (single)"}, {name: "Paper (multiple)"}];
let boxes = [{name : "Small box"}, {name: "Big box"}];

let paperAndPen = {name: "Paper and Pen", value: pens & papers};
let penCategory = {name: "Pens", value: pens};
let storage = {name: "Storage", value: boxes};

return [paperAndPen, penCategory, storage];

Create and connect list controls

1. Check the Allow Dependencies checkbox in the user step general section.

2. Create a List selection control in the user step.

   1. Set Source to be categories.

   2. Set the Prompt to be Category.

   3. Set the Large Row Text to be {name}.

   4. Set the Target Variable to be category.

3. Create another List selection in the user step.

   1. Set Source to be category.value.

   2. Set the Prompt to be Item.

   3. Set the Large Row Text to be {name}.

   4. Set the Selection reload behaviour to be keep my local changes.

Test the user step with keep my local changes

1. Save the Application.

2. Start the Application in any client.

3. Open the category list selection and select Paper and pen.

4. Open the item list selection.

   1. You can now see that you options are limited to only the pens and papers.

      1. Red pen

      2. Blue pen

      3. Green pen

      4. Paper (single)

      5. Paper (multiple)

   2. Select the Red pen

5. Open the category list selection and select Pens.

6. Open the item list selection.

   1. You can now see that the Red pen is still selected since it is still a valid option to select and the control has been set to Keep my local changes.

   2. You can see that your options are limited to only pens.

      1. Red pen

      2. Green pen

      3. Blue pen

7. Open the category list selection and select Storage.

8. Open the item list selection.

   1. You can now see that the Red pen is no longer selected since it is no longer a valid option.

   2. You can see that your options are limited to only boxes.

      1. Big box

      2. Small box

Test the user step with discard my local changes

1. Open the Application in the Designer.

2. Open the User step with the List controls.

3. Open the item list selection.

4. Set the Selection reload behaviour to be discard my local changes.

5. Repeat step 1 - 5 in from the previous example of Test Reload Strategy Keep Changes.

6. Open the item list selection

   1. You can now see that the Red pen is not selected anymore after the change of the category due the control being set to Discard my local changes.

   2. You can see that your options are limited to only pens.

      1. Red pen

      2. Green pen

      3. Blue pen