CodeCharge Studio

Radio Button Overview

HTML

<!-- BEGIN RadioButton RadioButton1 -->
  <input {Check} type="radio" name="RadioButton1" value="{Value}"> {Description}
<!-- END RadioButton RadioButton1 -->

Image

Description

Radio button controls are used for the selection of mutually exclusive options. A number of radio buttons with the same name are presented so the user can select one. When a radio button control is rendered on the page, the default behavior is to have all the radio buttons appearing horizontally as shown below:

You may have the individual radio buttons appear vertically by adding a break line <br> tag to the HTML code for the radio control. The original code for the radio control would look like:

<!-- BEGIN RadioButton Label1 -->
  <input {Check} type="radio" name="Label1" value="{Value}">{Description}
<!-- END RadioButton Label1 -->

A <br> tag should be added before the closing comment as in:

<!-- BEGIN RadioButton Label1 -->
  <input {Check} type="radio" name="Label1" value="{Value}"> {Description} <br>
<!-- END RadioButton Label1 -->

With this adjustment, the radio buttons will display vertically as shown below:

See also

Radio Button Reference


On-line, printable versions and updates