Skip to content

Radio Group ui-radio-group

Try Demo

Adds a Radio Group to your dashboard that will emit values in Node-RED under msg.payload anytime a value is selected.

Programmatic Selections

You can dynamically make selections for this dropdown by passing in the respective value to msg.payload, e.g. msg.payload = "option1".

Clear Selection

To clear any selection for a dropdown, pass an empty string "" as msg.payload.

Properties

PropDynamicDescription
GroupDefines which group of the UI Dashboard this widget will render in.
LabelThe text shown above the radio group to inform the user of what options are available. Html content is allowed.
OptionsA list of the options available in the radio group. Each row defines a `label` (shown alongside each radio button) and `value` (emitted on selection) property.
ColumnsThe number of grid columns within which to render the radio group. This is useful for when you want to render the options horizontally, or if you have many options and want to save vertical space.
TopicThe `msg.topic` that will be included in any emitted values

Dynamic Properties

Dynamic properties are those that can be overriden at runtime by sending a particular msg to the node.

Where appropriate, the underlying values set within Node-RED will be overriden by the values set in the received messages.

PropPayloadStructuresExample Values
Labelmsg.ui_update.labelString
Optionsmsg.ui_update.options
  • Array<String>
  • Array<{value: String}>
  • Array<{value: String, label: String}>
Classmsg.ui_update.classString
Columnsmsg.ui_update.columnsNumber

Example

Example of a radio groupExample of a rendered radio group in a Dashboard with 2 columns.