Toggle

<tc:selectBooleanToggle label="Toggle" value="true"/> Normal Toggle

Read Only

Disabled

Required

Normal Toggle

Large Label

Item Label

Read Only

Disabled

Required

In this example, the selected items are displayed in an output field after the submit-button is pressed.

<tc:selectBooleanToggle label="A" value="#{selectBooleanToggleController.a}"/> <tc:out label="Selected items: " value="#{selectBooleanToggleController.selectedItems}"/> A

B

C

Selected items: Submit

The output fields always shows the current value of the toggle. With <f:ajax render="output"/>, the output field will be rerendered, after the value changed in the <tc:selectBooleanToggle label="Character" value="false"/>. The ID of the output field and the value in the render attribute of the ajax tag has to be the same.

D

Value isfalse E

Value isfalse F

Value isfalse

<tc:selectBooleanToggle itemLabel="Japanese Yen" itemImage="/demo-5-snapshot/image/JPY-14.png"/> <tc:selectBooleanToggle itemLabel="Trinidad & Tobago Dollar" itemImage="/demo-5-snapshot/image/TTD-14.png"/> <tc:selectBooleanToggle itemLabel="US Dollar" itemImage="/demo-5-snapshot/image/USD-14.png"/> <tc:selectBooleanToggle itemLabel="Euro" itemImage="/demo-5-snapshot/image/EUR-14.png"/>

Japanese Yen

Trinidad & Tobago Dollar

US Dollar

Euro