The <a4j:actionParam> behavior combines the functionality of the JavaServer Faces (JSF) components <f:param> and <f:actionListener>.

Basic usage of the <a4j:actionParam> requires three main attributes:

Example 4.1, “<a4j:actionParam> example” shows a simple implementation along with the accompanying managed bean. When the Set name to Alex button is pressed, the application sets the name parameter of the bean to Alex, and displays the name in the output field.

<h:form id="form">

    <a4j:commandButton value="Set name to Alex" reRender="rep">

        <a4j:actionparam name="username" value="Alex" assignTo="#{actionparamBean.name}"/>

    </a4j:commandButton>

    <h:outputText id="rep" value="Name: #{actionparamBean.name}"/>

</h:form>

public class ActionparamBean {

    private String name = "John";


    public String getName() {

        return name;

    }


    public void setName(String name) {

        this.name = name;

    }

}

[D]

Figure 4.1. <a4j:commandButton>

The <a4j:commandButton> is similar to the JavaServer Faces (JSF) component <h:commandButton>, but additionally includes Ajax support. When the command button is clicked it generates an Ajax form submit, and when a response is received the command button can be dynamically rendered.

The <a4j:commandButton> requires only the value and render attributes to function. The value attribute specifies the text of the button and the render attribute specifies which areas are to be updated. The <a4j:commandButton> uses the onclick event instead of the onsubmit event, but otherwise uses all common Ajax attributes as listed in Chapter 2, Common Ajax attributes.

[D]

Figure 4.2. <a4j:commandLink>

The <a4j:commandLink> is similar to the JavaServer Faces (JSF) component <h:commandLink>, but additionally includes Ajax support. When the command link is clicked it generates an Ajax form submit, and when a response is received the command link can be dynamically rendered.

The <a4j:commandLink> requires only the value and render attributes to function. The value attribute specifies the text of the link and the render attribute specifies which areas are to be updated. The <a4j:commandLink> uses the onclick event instead of the onsubmit event, but otherwise uses all common Ajax attributes as listed in Chapter 2, Common Ajax attributes.

The following reference data is taken from the old <rich:componentControl> reference. The details may be different now that the component is part of the a4j tag library.

The <rich:componentControl> allows JavaScript API functions to be called on components after defined events. Initialization variants and activation events can be customized, and parameters can be passed to the target component.

The event, for, and operation attributes are all that is required to attach JavaScript functions to the parent component. The event attribute specifies the event that triggers the JavaScript API function call. The for attribute defines the target component, and the operation attribute specifies the JavaScript function to perform.

<h:commandButton value="Show Modal Panel">

    <!--componentControl is attached to the commandButton-->

    <rich:componentControl for="ccModalPanelID" event="onclick" operation="show"/> 

</h:commandButton>

The attachTo attribute can be used to attach the event to a component other than the parent component. If no attachTo attribute is supplied, the <rich:componentControl> component's parent is used, as in Example 4.2, “rich:componentControl basic usage”.

<rich:componentControl attachTo="doExpandCalendarID" event="onclick" operation="Expand" for="ccCalendarID" />

Incomplete

The <a4j:jsFunction> component allows Ajax requests to be performed directly from JavaScript code, and server-side data to be invoked and returned in JavaScript Object Notation (JSON) format to use in client-side JavaScript calls.

The <a4j:jsFunction> component has all the common Ajax action attributes as listed in Chapter 2, Common Ajax attributes; the action and actionListener attributes can be invoked and parts of the page can be re-rendered after a successful call to the JavaScript function. Example 4.5, “<a4j:jsFunction> example” shows how an Ajax request can be initiated from the JavaScript and a partial page update performed. The JavaScript function can be invoked with the data returned by the Ajax response.

<h:form>

    ...

    <a4j:jsFunction name="callScript" data="#{bean.someProperty1}" reRender="someComponent" oncomplete="myScript(data.subProperty1, data.subProperty2)">

        <a4j:actionParam name="param_name" assignTo="#{bean.someProperty2}"/>

    </a4j:jsFunction>

    ...

</h:form>

The <a4j:poll> component allows periodical sending of Ajax requests to the server. It is used for repeatedly updating a page at specific time intervals.

The interval attribute specifies the time in milliseconds between requests. The default for this value is 1000 ms (1 second).

The timeout attribute defines the response waiting time in milliseconds. If a response isn't received within the timeout period, the connection is aborted and the next request is sent. By default, the timeout is not set.

The <a4j:poll> component can be enabled and disabled using the enabled attribute. Using Expression Language (EL), the enabled attribute can point to a bean property to apply a particular attribute value.

The <a4j:push> component periodically performs an Ajax request to the server, simulating "push" functionality. While it is not strictly pushing updates, the request is made to minimal code only, not to the JSF tree, checking for the presence of new messages in the queue. The request registers EventListener, which receives messages about events, but does not poll registered beans. If a message exists, a complete request is performed. This is different from the <a4j:poll> component, which performs a full request at every interval.

The interval attribute specifies the time in milliseconds between checking for messages. The default for this value is 1000 ms (1 second). It is possible to set the interval value to 0, in which case it is constantly checking for new messages.

The timeout attribute defines the response waiting time in milliseconds. If a response isn't received within the timeout period, the connection is aborted and the next request is sent. By default, the timeout is not set. In combination with the interval attribute, checks for the queue state can short polls or long connections.

REVIEW COMMENT - a4j:repeat is not an action, should be moved. The <a4j:repeat> component is used to iterate changes through a repeated collection of components. It allows specific rows of items to be updated without sending Ajax requests for the entire collection. The <a4j:repeat> component forms the basis for many of the tabular components detailed in Chapter 8, Tables and grids.

The contents of the collection are determined using Expression Language (EL). The data model for the contents is specified with the value attribute. The var attribute names the object to use when iterating through the collection. This object is then referenced in the relevant child components. After an Ajax request, only the rows specified with the ajaxKeys attribute are updated rather than the entire collection. Example 4.6, “<a4j:repeat> example” shows how to use <a4j:repeat> to maintain a simple table.

<table>

    <tbody>

        <a4j:repeat value="#{repeatBean.items}" var="item" ajaxKeys="#{updateBean.updatedRow}">

            <tr>

                <td><h:outputText value="#{item.code}" id="item1" /></td>

                <td><h:outputText value="#{item.price}" id="item2" /></td>

            </tr>

        </a4j:repeat>

    </tbody>

</table>

REVIEW COMMENT: a4j:support is a4j:ajax in 4.0, paths need to be updated. The <a4j:ajax> component allows Ajax capability to be added to any non-Ajax component. It is placed as a direct child to the component that requires Ajax support. The <a4j:ajax> component uses the common attributes listed in Chapter 2, Common Ajax attributes.

<h:panelGrid columns="2">

    <h:inputText id="myinput" value="#{userBean.name}">

        <a4j:ajax event="onkeyup" reRender="outtext" />

    </h:inputText>

    <h:outputText id="outtext" value="#{userBean.name}" />

</h:panelGrid>