Radio

The Radio component changes theme of browser-default radio buttons to a form more adapted to the mobile environment.

Note
This component is supported since Tizen 2.4.
It was renamed from CheckboxRadio component of Tizen 2.3.

Table of Contents

  1. Default Selectors
  2. HTML Examples
  3. Methods

Default Selectors

By default, all <input> elements with type="radio" or class="ui-radio" are displayed as radio button.

HTML Examples

To create a radio component, please refer following example:

<input type="radio" name="radio-choice" id="radio-choice-1" value="choice-1" checked="checked" />
<label for="radio-choice-1">Cat</label>
<input type="radio" name="radio-choice" id="radio-choice-2" value="choice-2"  />
<label for="radio-choice-2">Dog</label>

Methods

Summary

Method Description
disable (  ) 

Disables the component.

enable (  ) 

Enables the component.

value ( ) 

Sets/Gets the value from radio element.

disable

Disables the component.

disable ( ) 

Return value:

Type Description
Radio The disabled Radio component.

Code example:

<input type="radio" name="radio-1" id="radio-1"/><label for="radio-1">Normal</label>
<script>
   var element = document.getElementById("radio-1"),
       radioWidget = tau.widget.Radio(element);
   radioWidget.disable();
</script>
enable

Enables the component.

enable ( ) 

Return value:

Type Description
Radio The enabled Radio component.

Code example:

<input type="radio" name="radio-1" id="radio-1"/><label for="radio-1">Normal</label>
<script>
   var element = document.getElementById("radio-1"),
       radioWidget = tau.widget.Radio(element);
   radioWidget.enable();
</script>
value

Sets/Gets the value from the radio element.

{ string | number } value ( ) 

Return value:

Type Description
String | number When the method does not have a value parameter, it returns value of element.

Code example:

<input type="radio" name="radio-1" id="radio-1"/><label for="radio-1">Normal</label>
<script>
   var element = document.getElementById("radio-1"),
       radioWidget = tau.widget.Radio(element);

   // Sets value to radio element
   radioWidget.value("radio-value");
   // Gets checked radio element
   console.log(radioWidget.value());
</script>