jQuery Mobile - Radio Widget

Radio buttons are used when out of many options, just one option is required to be selected. They are also created using <input> tag but type attribute is set to radio.

Following table demonstrates the types of radio button in detail.

Sr.No. Type & Description
1 Basic markup

Radio buttons can be created using the <input> element with a type = "radio" attribute and a corresponding label.

2 Mini size

In fieldset element, include attribute data-mini = "true" for creating a mini version.

3 Vertical group

By default, the radio is set vertically.

4 Horizontal group

Set the radio horizontally by including the data-type = "horizontal" to the fieldset.

5 Icon position

The position of the radio icon button can be set at the right side using data-iconpos = "right" attribute to the fieldset.

6 Theme

Theme is set to the radio button using the attribute data-theme.

7 Disabled

Set the attribute disabled = "disabled" in the input to disable the radio button.

8 Enhanced

The radio is enhanced using the data-enhanced = "true" into the input field.

Kickstart Your Career

Get certified by completing the course

Get Started