I. Overview
1) In designing a form, you can insert a Radio Button Group widget to choose a single data option.
2) The Radio Button Group widget displays all options in the report for users to check.
3) These options should be set using the data dictionary. In the preview mode, options they see are Display Values and the data they have submitted are the Actual Values.
4) The Radio Button Group is a data entry widget. After clicking Data Entry Preview and New Data Entry Preview modes, you can see the effect of the widget.
| You will Learn |
|---|
|
II. Steps
1. Insert a Radio Button Group widget
Click B2, click [Widget Setting] in the right-hand pane, click the drop-down box, and choose [Radio Button Group].
2. Set the widget name
1) Set the names of the widgets inserted in B2 and C2 respectively.
2) After setting the names, access the widgets through JavaScript, and modify their attributes.
3. Set the data dictionary: database table
1) Click B2. Click [...] following the [Data Dictionary] and the setting pane will pop up.
2) Settings of the data dictionary:
Type: Datasource from Database
DB: FRDemo
Select Database Table：Sales_Volume
Actual Value: Product
Display Value: Product
Click [OK] and the setting is completed.
4. Preview the widget effect
1) Modify report display
Right click Column B, choose [Set the column width], and input 40. Click [OK].
Right click Row 2, choose [Set the line height], input 20. Click [OK].
2) Select [Data Entry Preview]. The page displays all product options, which can be selected by directly checking them.
5. Set the data dictionary: custom
1) Click B2. Click [...] following the [Data Dictionary] and the setting pane will pop up.
2) Settings of the data dictionary:
Type: Custom
Click [+] to set the Radio Button 1:
Actual Value: 1
Display Value: Online shopping
Click [+] to set the Radio Button 2:
Actual Value:2
Display Value: Bricks and mortar
Click [OK] and the setting is completed.
3) Data entry preview. The page displays custom options.
6. Insert a new dataset [ds1]
1) Create a new DB query dataset.
2) Drag the table [Sales_Volume] into the DB query.
7. Set the data dictionary: dataset
1) Click B2. Click [...] following the [Data Dictionary] and the setting pane will pop up.
2) Settings of the data dictionary:
Type: Data Query
Dataset: ds1
Actual Value: Salesperson
Display Value: Salesperson
Click [OK] and the setting is completed.
3) Data entry preview. The page displays all salesperson options.
8. Layout of options: Adaptive
1) The layout of options in B2 is [Adaptive] by default.
2) Adjust the width and height of B2. Options in the cell are adapted to the size of the cell.
9. Layout of options: Fixed number of columns
1) Click B2 and uncheck [Adaptive].
2) Number of columns displayed: 1.
3) Data entry preview. Options are displayed in a single column.
10. Disable the widget
1) Click B2 and uncheck [Enabled].
2) Data entry preview. All options are greyed and cannot be checked.
11. Hide the widget
1) Click B2, check [Enabled] and uncheck [Visible Widget].
2) Data entry preview. All options are invisible and cannot be checked.
12. Validate the input value: Not allow null
1) Click B2, check [Visible Widget], and uncheck [Allow Null]. Enter an error tip: Select a salesperson!
2) Data entry preview. Click to check a salesperson first and then click again to uncheck it. An error tip pops up on the right-hand side of the browser window.
Previous：Report Button Widget
