PushButton

You are viewing an old version (v. 23) of this page.
The latest version is v. 38, last edited on Jan 12, 2016 (view differences | )
<< View previous version | view page history | view next version >>

Overview

The PushButton component allows submission of a form in it's entirety or also the submission of itself only. This component supports an action attribute as well as an actionListener attribute similar to a h:commandButton.

Usage

<html ... xmlns:ace="http://www.icefaces.org/icefaces/components">

<!--  can use either class of ice-skin-sam or ice-skin-rime -->
<h:body class="ice-skin-sam">
    <h:form >
        <h:panelGroup id="push1">
	    <ace:pushButton
                id="pushId"
                value="submit"
                label="this button submits the entire form"
	        actionListener="#{button.actionListenerMethod}"  />
	</h:panelGroup>
    </h:form>
</h:body>

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 refers to the text written on the button, similar to that of jsf commandButton.

label If no value present, the label will be used for the pushButton. Otherwise if both are used, the label will be used to define the aria-role, described-by.

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 pushbutton only submits an event request via submit call with execute=@this and render=@all, in other words, only the button is submitted with any action/actionListener attributes. If false then full form submit happens where execute being set to @all.
Default valid is false.

ARIA and Keyboard Navigation Support

Pushbutton component supports keyboard short-cuts and ARIA. Aria support can be enabled at page level or at application level. By default ARIA is enabled at application level.

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>
  • space or enter key will fire the button's onclick event

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

Storyboard

Action focus hover active disabled onkeypress aria
yui-class yui-button-focus yui-button-hover yui-button-active yui-button-disabled space or enter will submit role, disabled, description
Submit     submit form & queus event none submit form/queue event  
Single Submit     submit button only & queue event none submit form/queue event  
Action
ActionListener
Screen Reader description description role & description role    
Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.

© Copyright 2017 ICEsoft Technologies Canada Corp.