Flip Switch

flipswitch

The flipswitch component displays a command button that toggles between an On and Off state. This UI element is common on the iOS platform for toggling a setting on or off. This component generates server side action event when pressed.  SingleSubmit = "true" means that the button will submit itself and render the page with whatever has changed (typicaly ICEfaces 2.0 singleSubmit behaviour). This component is also supported by the mobi:ajax tag for more options on ajax support.

SingleSubmit = false means the state of the button stays on the client until the form is submitted with some other component (typically a submit button).

Usage

<h:outputLabel for="cor" value="Auto-Correction"/>
<mobi:flipswitch id="cor" style="float:right"
                        labelOn="ON" labelOff="OFF"
                        value="#{flipSwitchBean.autoCorrection}"/>
<h:outputLabel for="cor" value="Auto-Correction"/>
<mobi:flipswitch id="cor" style="float:right" singleSubmit="true"
                        labelOn="ON" labelOff="OFF"
                        value="#{flipSwitchBean.autoCorrection}"/>

Theming

FlipSwitch supports device theming by providing default styles for Apple, Android and Blackberry.  CSS class names are as follows:

Component Documentation

flipswitch