RadioGroup and RadioButton properties
Usage
{
type: "radiogroup",
name?: string,
id?: string,
options: {
rows?: [
{
type: "radiobutton",
id?: string,
value: string,
checked?: boolean,
css?: string,
height?: string | number | "content",
hidden?: boolean,
padding?: string | number,
text?: string,
width?: string | number | "content",
},
// more radio buttons
],
cols?: [
{
type: "radiobutton",
id?: string,
value: string,
checked?: boolean,
css?: string,
height?: string | number | "content",
hidden?: boolean,
padding?: string | number,
text?: string,
width?: string | number | "content",
},
// more radio buttons
],
css?: string,
height?: string | number | "content",
padding?: string | number,
width?: string | number | "content",
},
value?: string,
css?: string,
disabled?: boolean,
height?: string | number | "content", // "content" by default
hidden?: boolean,
padding?: string | number,
required?: boolean, // false by default
width?: string | number | "content", // "content" by default
hiddenLabel?: boolean, // false by default
label?: string,
labelPosition?: "left" | "top", // "top" by default
labelWidth?: string | number,
helpMessage?: string,
preMessage?: string,
successMessage?: string,
errorMessage?: string,
}
Description
RadioGroup properties
| type | (required) the type of a control, set it to "radioGroup" |
| name | (optional) the name of a control |
| id | (optional) the id of a control, auto-generated if not set |
| options | (required) an object with options of a RadioGroup. The object can contain the following attributes:
|
| value | (optional) the initial value of a RadioGroup. The option has a higher priority than the checked attribute of a RadioButton |
| css | (optional) adds style classes to a control |
| disabled | (optional) defines whether a control is enabled (false) or disabled (true) |
| height | (optional) the height of a control |
| hidden | (optional) defines whether a RadioGroup is hidden |
| padding | (optional) sets padding between a cell and a border of a RadioGroup control |
| required | (optional) defines whether a control is required |
| width | (optional) the width of a control |
| hiddenLabel | (optional) invisible label that will be used to identify the input on the server side |
| label | (optional) specifies a label for a control |
| labelPosition | (optional) defines the position of a label: "left"|"top" |
| labelWidth | (optional) sets the width of the label of a control |
| helpMessage | (optional) adds a help message to a control |
| preMessage | (optional) a message that contains instructions for interacting with the control, applied for all radio buttons in a group |
| successMessage | (optional) a message that appears in case of successful validation of the control value, applied for all radio buttons in a group |
| errorMessage | (optional) a message that appears in case of error during validation of the control value, applied for all radio buttons in a group |
RadioButton properties
| type | (optional) the type of a control, set it to "radioButton" |
| id | (optional) the id of a control, auto-generated if not set |
| value | (required) the value of a radioButton |
| checked | (optional) defines the initial state of a radio button, only one radio button can be checked at a time |
| css | (optional) adds style classes to a control |
| height | (optional) the height of a control |
| hidden | (optional) defines whether a radio button is hidden |
| padding | (optional) sets padding between a cell and a border of a radio button |
| text | (optional) the text label of a radio button |
| width | (optional) the width of a control |
Example
Related article: RadioGroup