CheckboxButton

Overview

The checkboxButton component is a simple true/false selection used to toggle a value that is bound to the button. When singleSubmit="true" the value will be submitted to the server. When "false", the value is maintained by the client until some other component submits the form the checkboxButton occurs in.

NOTE that rendering with class="ice-skin-sam" renders this component as a checkbutton (use label attr with labelPosition="on")
with class="ice-skin-rime" it is rendered as a checked box (use labelPosition="left")

Usage

<html ... xmlns:ice="http://www.icefaces.org/icefaces/components">
<!-- can use either ice-skin-sam or ice-skin-rime -->
<h:body class="ice-skin-rime">
    <h:form>
        <ice:checkboxButton
            value="{button.checkedRime}"
            labelPosition="left"
            label="checkedRime"
            singleSubmit="true"/>
    </h:form>
</h:body>
</html>

<h:panelGroup styleClass="ice-skin-sam">
    <ice:checkboxButton
        value="#{button.checkedSam}"
        label="checkedSam"
        labelPosition="on"
        singleSubmit="false"/>
</h:panelGroup>

Attributes

TagLib Documentation
This section covers attributes involved in the typical use-cases for this component. For reference, the complete taglib documentation for this component is available here.

value the value binding (bean) tied to the value of the checkboxButton-usually to a backing bean through el.

label The label of the button-what the user sees that relates to that particular button. For example, "Remember Me"

labelPosition position of the label. For ice-skin-sam, the label is placed directly on the button itself so labelPosition is "on". For ice-skin-rime, the label is placed to the left of the button, so labelPosition="left"

style a pass through to the root element of the component.

styleClass a pass through to the root element of the component.

tabindex a pass through to the root element of the component, default=0.

disabled a pass through to the root element of the component.

singleSubmit When singleSubmit attribute is true, the checkbox only submits an event request to the server representing an ajax call with execute=@this and render=@all, if false then only the hidden field is updated on the client and some other component must submit the form for the server model side to be updated.

Default is "true"

ARIA and Keyboard Navigation Support

To enable/disable ARIA at page level, the [<icecore:config>] tag can used:

<icecore:config ariaEnabled="true"/>

To enable/disable ARIA at application level, the following param can be set in web.xml.

<context-param>
   <param-name>org.icefaces.aria.enabled</param-name>
   <param-value>false</param-value>
</context-param>

the space key will toggle the checkbox/checkbutton

Aria role="button", aria-describedby and aria-disabled properties supported as well as aria-checked.
The ARIA implementation is based on the specification at check box aria practices. Currently only the basic ARIA attributes and single-key keyboard shortcuts have been implemented.

Storyboard

Action	focus	hover	checked	disabled	onkeypress	aria
yui-class	yui-button-focus	yui-button-hover	yui-button-checked	yui-button-disabled	space or enter will submit	role, disabled, description, checked
Submit			submit button &update component	none	submit button/update component
Single Submit			stay on client/update hidden field	none	update hidden field
Screen Reader	description	description	role,description, checkedvalue	role	& checked value