Screens sometimes require input information. This is common in navigation, when users click on a link wanting to see more about an item. The destination Screen receives the information about the item, for example an identifier of a product. You pass information between screens with Input Parameters.
To pass information with Input Parameters:
- In the destination Screen add an Input Parameter.
- In the source Screen add a link to the destination Screen and set the Input Parameter value.
You can use Input Parameters with Blocks as well.
Add a new Input Parameter in the destination Screen
To add an Input Parameter to a Screen in Service Studio:
Go to Interface > UI Flows > MainFlow and locate your Screen.
Right-click the Screen and select Add Input Parameter. A new Input Parameter appears.
Service Studio selects the name of the Input Parameter and sets the focus for you to enter the name. Enter the name of the Input Parameter and press the Enter key.
Use smart names with Input Parameters to set the data type automatically. For example, if you create an Input Parameter and name it PurchaseDate, Service Studio sets the data type to Date. See more in Service Studio Tips and Tricks.
Send a value from the source Screen
In the Screen from which you're linking (source) to the Screen that receives the value (destination), add a widget and supply a value in the On Click Event. Here is an example with a Link widget, but the same works with a Button.
Search for the Link widget and drag it to the Screen. Then, enter your link text, for example "A link to another page".
Right now you can't publish the app because the 1-Click Publish button is red and there's an error. That is expected, as you need to set a destination for your Link as well.
Select the Link widget, go to Properties > Events > On Click, and in the list select your destination Screen. Notice how the Input Parameter shows below the Screen name in the properties.
Still in the Link widget properties, under the Screen you selected, set the value for the Input Parameter.
In our example, we entered 100 directly in the Input Parameter field. Usually you set a dynamic value, for example, with a Local Variable.
Publish the app. When you click the link in the source Screen, the user navigates to the destination Screen. The destination Screen opens and receives 100 as the value of the Input Parameter.