Using a Radio Button List

Overview

When a user checks Radio Button in the list of URLs its value should be passed into Open URL Button control. When a user clicks Open URL Button, a new window should be opened using the chosen URL from the list. It could be accomplished with a child Flow that will accept URL String from the List and serve as an Input to the Open URL Button control on the Form.

Example

In this example create a Form with a Radio Button List type of URLs and Open URL Button.

First, create a Flow. Begin in the Designer Folder with selecting Create Flow button from Folder Actions panel.

Connect the Start step and End step. Select the Start step and using Step Information dialog select Show Editor link to add new Flow Input Data.

In the resulting dialog define a name for the Flow Input Data as InputString. Then, select 'CLOSE' to save and close this window.

Next, select the End Step on the workspace and select Show Editor link in the Step Information dialog to add new Output Data.

In the resulting dialog name the Output Data and define its type String. Remember the name of this output it will be used in the Form for the Open URL Button control as Input Data Name field.

Next, using Step Information dialog for the End step, define the mapping for the Outcome Data. Define its Mapping Type as Select Value and use Path Picker to map this Value to InputString value in the Flow.

This completes the Helper Flow. Save the Flow and close Flow Designer.

Now, create the main Flow with Form in it. In the Designer Folder, select Create Flow button again to create a New Flow. Name it and select Create to proceed to the Flow Designer.

In the Flow Designer expand the Favorite Steps category and add the Show Form step to the Flow.

In the resulting window select Pick Or Create Form link to start creating the Form.

Next, name the Form and select 'Create' to proceed to the Form Designer.

In the Form Designer, drag a Button control from the Actions category of the Form Controls panel to the workspace. Rename this Button to "Close Form" because this Outcome will serve as Close Button for the Form. Additionally, drag Open URL Button from Actions > URL category in the Form Controls panel to the workspace.

Next, add the Radio Button List component from the Data category in the Form Controls panel.

Configure this List as follows. Define its Type as String. It is going to be a Static List of three URLs. It will serve for Output Only with Required Outcome Close Form control. Finally, the name Selected Item as "SelectedUrl".

Next, select Open URL Button on the workspace and navigate to its Properties. In the Properties panel there are multiple properties that need to be configured with the Open URL control:

• Text: What the button/link will say
• URL: Static URL
• URL from Data Name: URL passed in from flow.
• Is Relative to base: URL depends on the base URL. Example: localhost or google.com are base URLs. The designer doesn't need to pass in the base URL if this is checked.

In this example use URL From Data Name. In the Data Name text box type Flow: OutputString which is the name of the Outcome from the Helper Flow.

Then, select the Form Container and navigate to the Form Properties. Locate Form Rules configuration and select Add New for the Data Flows box.

In the resulting Add Data Flows window configure the Helper Flow's Outcome as an Input Data for this Form. First, name the Flow Input Data in the Flow Name textbox. Then, use Flow picker to pick the Helper Flow.

Next, in the Flow Inputs box select InputString input to the Helper Flow and select Edit to provide this variable with the values from the Radio Button List.

In the resulting dialog select Form Component option from InputType dropdown.

Next in the FormDataName choose SelectedUrl because this variable will hold the String value of the URL that the user chooses. This completes the Form Design. Save and close all windows. Save the Form and close the Form Designer to return back to the Flow Designer.

In the Flow Designer, connect Close Form outcome from the Form to the End step in the Flow. This completes the Main Flow Design. Select the Debug link on the top panel of the Flow Designer to test the Main Flow.

The Form opens in the Debugger and check Radio Button in the list and select Open URL Button control.

Observe that the result is as designed. The URL that is chosen opens in a new window.