Skip to main content
Skip table of contents

Radio Widget

Definition

The Radio Edit Widget allows to configure the edit of a string type by configuring a list of values.

The user will be able to choose one and only one value.

Radio Edit (STANDARD)

Radio Edit (BUTTON_GROUP)

Configuration

Properties

Property name

Type

Mandatory

Description

Values (default value in bold)

i18nPrefix

-

NO

Allows to define the first part of the i18n key for each configured id.

If this property is used, you cannot use the <text> property, otherwise the translation not will be taken into account.

-

id

String

NO

Defines a unique id for each option.

-

inline

Boolean

NO

Defines if the buttons are inline or not.

Only available for STANDARD style.

true, false

options

List<RadioOptionType>

NO

Allows to define one or several value(s) to choose.

-

radioStyle

Enum

NO

Defines the display of the buttons.

STANDARD, BUTTON_GROUP 

options properties

Property name

Type

Mandatory

Description

Values (default value in bold)

option

RadioOptionType

NO

Defines the different values.

-

option properties

Each option will have the following configuration:

Property name

Type

Mandatory

Description

Values (default value in bold)

id

String

NO

Defines a unique id for each option.

-

text

String

NO , but necessary

Defines, for each id, the text that will be displayed to the user. 

-

Example

Radio Edit

Radio Edit with i18nPrefix

CODE
<widget id="test_radio_edit" xsi:type="ctdbum:AttributeEditorWidgetType">
	<hidden>false</hidden>
    <config>
    	<editor>
        	<editWidget xsi:type="ctdbum:RadioEditWidgetType">
            	<hidden>false</hidden>
                <config>
                    <required>false</required>
                    <radioStyle>STANDARD</radioStyle>
                    <inline>true</inline>
                    <options>
                    	<option>
                        	<id>test_1</id>
                            <text>test_1</text>
                        </option>
                        <option>
                            <id>test_2</id>
                            <text>test_2</text>
                        </option>
                        <option>
                            <id>test_3</id>
                            <text>test_3</text>
                        </option>
					</options>
				</config>
			</editWidget>
		</editor>
        <label></label>
        <lockedInUi>false</lockedInUi>
        <mode>READ_WRITE</mode>
        <multiValued>false</multiValued>
        <override>true</override>
	</config>
    <attributeId>test_radio_edit</attributeId>
</widget>

CODE
<widget id="test_radio_edit" xsi:type="ctdbum:AttributeEditorWidgetType">
	<hidden>false</hidden>
    <config>
    	<editor>
        	<editWidget xsi:type="ctdbum:RadioEditWidgetType">
            	<hidden>false</hidden>
                <config>
                    <required>false</required>
                    <radioStyle>STANDARD</radioStyle>
                    <inline>true</inline>
					<i18nPrefix>ui.model.attribute.test_radio_edit.values</i18nPrefix>
                    <options>
                    	<option>
                        	<id>test_1</id>
                        </option>
                        <option>
                            <id>test_2</id>
                        </option>
                        <option>
                            <id>test_3</id>
                        </option>
					</options>
				</config>
			</editWidget>
		</editor>
        <label></label>
        <lockedInUi>false</lockedInUi>
        <mode>READ_WRITE</mode>
        <multiValued>false</multiValued>
        <override>true</override>
	</config>
    <attributeId>test_radio_edit</attributeId>
</widget>In this case, the i18n keys should be:
  • ui.model.attributes.test_radio_edit.values.test_1.label

  • ui.model.attributes.test_radio_edit.values.test_2.label

  • ui.model.attributes.test_radio_edit.values.test_3.label

Read Next

  • Features

    Design screens and business features to manage objects.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.