ZK Component Reference/Input/Radiogroup

Radiogroup

• Demonstration: Radiogroup
• Java API: Radiogroup
• JavaScript API: Radiogroup

Employment/Purpose

Used to group multiple radio buttons. In one radiogroup. Only one radio button may be selected at a time.

Example

<window title="Radiobox &amp; Radio Demo">
	<vbox>
		<radiogroup onCheck="fruit.value = self.selectedItem.label">
			<radio label="Apple" />
			<radio label="Orange" />
			<radio label="Banana" />
		</radiogroup>
		You have selected :
		<label id="fruit" style="color:red" />
	</vbox>
</window>

Note: To support the versatile layout, a radio group accepts any kind of children , including Radio. On the other hand, the parent of a radio, if any, must be a radio group.

Radiogroup as an ancestor of radio

ZK groups a radio components into the same radio group if the share the same ancestor, not just direct parent. It allows a more sophisticated layout. For example,

<radiogroup>
  <vlayout>
    <hlayout>
      <radio label="radio 1"/>
      <radio label="radio 2"/>
      <radio label="radio 3"/>
	</hlayout>
    <hlayout>
      <radio label="radio 4"/>
      <radio label="radio 5"/>
      <radio label="radio 6"/>
	</hlayout>
  </vlayout>
</radiogroup>

A row of a grid as a radio group

[since 5.0.4]

Sometimes it is not possible to make the radiogroup component as an ancestor of all radio components. For example, each row of a grid might be an independent group. To solve this, you have to assign the radiogroup component to the radio component explicitly by use of Radio.setRadiogroup(String) or Radio.setRadiogroup(Radiogroup).

<radiogroup>
  <grid>
    <rows>
      <row>
        Most popular
        <radiogroup>
          <radio label="Java"/>
          <radio label="Groovy"/>
          <radio label="C#"/>
        </radiogroup>
      </row>
      <row>
        Most fun
        <radiogroup>
          <radio label="Open Source"/>
          <radio label="Social Networking"/>
          <radio label="Searching"/>
        </radiogroup>
      </row>
    </rows>
  </grid>
</radiogroup>

Supported events

Name	Event Type
None	None

Supported Children

*ALL

Use cases

Version	Description	Example Location
5.0	Radiogroup and selection	http://www.zkoss.org/forum/listComment/12148
5.0	Radiogroup, data binding and TypeConverter	http://www.zkoss.org/forum/listComment/7011

Version History

Version	Date	Content