Audience
  • Developers
  • View Designers
Required Knowledge
  • Views
  • Rules
  • Controls

Introduction

The latest How To topics are available in the K2 Five User Guide or the K2 Cloud User Guide’s How to section.
The Radio Button controls consist of the following:
  • Radio Button – Control contains one Radio Button that can interact with rules individually. Multiple Radio Button controls can be grouped together by using the Radio Button Group control which in effect provides a list of options. These Radio Button controls can still interact with rules individually
  • Radio Button Group – Control used to group Radio Button controls to create a list of options. This control is used for grouping purposes and is not visible at runtime
  • Radio Button List – Control contains a list of Radio Buttons and is used to select a single value from this list of options

Implementation Details

The image below shows the different displays of the Radio Button, Radio Button Group and Radio Button List as discussed above

Image

The Radio Button and Radio Button List can be configured individually by clicking on the control and configuring the Properties. When using multiple Radio Buttons and grouping them together, the Group property should be configured as shown above for each Radio Button belonging to that Group.

For more detailed information see the following topic in the K2 smartforms User Guide:

K2 smartforms > K2 Designer > Views > Creating Views > Layout > Toolbox > Controls > Radio Button Controls

Example Scenario

In the scenario below we will use the Investments View to open the Product Options subview. The Product Options subview contains two Radio Button controls that are grouped together. Each Radio Button control reacts according to certain rules configured on the control. When the rule is executed and the conditions are met, the data is transferred to the Investments View.  

Follow the steps below to set up the scenario:

  1. Create the Product Options unbound View. The View consists of the following:
      • 2 x Radio Button controls – Option 1 and Option 2
      • 4 x Drop-Down List controls
      • 1 x Radio Button Group control
      • OK and Cancel Button controls
    Image
  2. Group the two Radio Buttons together by selecting the Radio Button Group in the Group field of the Radio Button control’s Properties as shown below.
    Image
  3. Assign a Value to each Radio Button as shown in the image above. This field is used to determine the value of the Radio Button within the Radio Button Group when using advanced conditions and data transfers for example. In this scenario we’ve used the values of Option 1 and Option 2 for the different Radio Buttons
  4. Configure the data sources of the Drop-Down List controls as follows:
    Drop-Down List 1:
    Image

    Drop-Down List 2:
    Image

    Drop-Down List 3:
    Image

    Drop-Down List 4:
    Image
  5. Add the following rules:
    Rule 1
    Events: When a control on the View raises an event
    Actions: Close a subview or subform
    Image
    Rule 2
    Events: When a control on the View raises an event
    Actions: Close a subview or subform
    Image
  6. Rule 3

    Events: When a control on the View raises an event

    Execution Block 1:

    Conditions: an advanced condition is true

    Execution type: then start the following asynchronously

    Actions:
    Disable a control
    Disable a control
    Enable a control
    Enable a control
    Transfer data       

    Execution Block 2:

    Conditions: an advanced condition is true

    Execution type: then complete the following one after another

    Actions:
    Enable a control
    Enable a control Disable a control
    Disable a control
    Transfer data

    Image

    Condition 1

    Image

    Condition 2

    Image

    Transfer data 1 configuration

    Image

    Transfer data 2 configuration

    Image
  7. Finish the View
  8. Create the Investments unbound View. The View consists of the following:
      • 1 x Label control – Product Selection
      • 1 x Text Box control
      • 1 x Data Label control
      • Select Option and Clear Selection Button controls
    Image
  9. Add the following rules:

    Rule 1

    Events: When a control on the View raises an event

    Actions: Transfer data

    Image

    Transfer data configuration

    Image

    Rule 2

    Events: When a control on the View raises an event

    Actions: Open a subview

    Image
  10. Edit the rule “On Product Options – (When Select Option is Clicked) subview, when OK is Clicked” and add the following:

    Execution Block 1:

    Conditions: an advanced condition is true

    Execution type: then complete the following one after another

    Actions: Transfer data

    Execution Block 2:

    Conditions: an advanced condition is true

    Execution type: then complete the following one after another

    Actions:
    Transfer data
    Close a subview or subform
    Image

    Condition 1

    Image

    Condition 2

    Image

    Transfer data 1 configuration

    Image

    Transfer data 2 configuration

    Image
  11. Finish the View
  12. Run the Investments View
  13. Click the Select Option button. The Product Options subview opens
  14. Select Option 2. Note that the Drop-Down lists are enabled and the Radio Button controls function independently even though they are grouped together
  15. Select an option from both Drop-Down lists and click OK
  16. The subview closes and the data is transferred to the Investments View