Computer Magic Logo
Radio Button list

Sunday, June 7, 2015

Published by Aristotelis Pitaridis

In order to create a Radio Button list we must create our own data type that contains the options of the list. To achieve this we right click on the tree node Data Types of the Developers section to display the node’s commands.

From the commands panel we press on the Create command and the new data type creation form will appear on the screen.

In the name textbox we type the name of the new data type. From the Property editor dropdown list control we select the Radio button list option to inform the system that the new data type will be a Checkbox list. 

For each of the options that we want to add in the Radio button list we type the value in the Add prevalue text box and we click the Add button in order to submit the value.

When we finish with all the options we press the Save button to complete the creation of the new property. Now we can go to the General properties tab of a Document Type to use the new property.

The My Radio Button List property has the following appearance when we edit the document:

The value stored in the property contains a value of type integer which contains the ID of the item that user selected. We should be careful because the value of list items does not start from 0 or 1 but have a number set by Umbraco. In order to read the value as a strongly typed object we use the following code:

@{
    if (Model.Content.HasValue("myRadioButtonList"))
    {
        Int32 Selection = Model.Content.GetPropertyValue<Int32>("myRadioButtonList");
        <p>@Selection</p>
    }
}

In order to read the value using dynamic properties we use the following code:

@{
    if (CurrentPage.HasValue("myRadioButtonList"))
    {
        Int32 Selection = CurrentPage.myRadioButtonList;
        <p>@Selection</p>
    }
}