How to disable UI components in ADF using ClientListener and ServerListener components in ADF Faces

This blog article explains a common usage, how to invoke a server side method upon some action performed on a client side(UI Layer)

Usecase :  Invoke a backing bean method while loading a page.

Implementation:

The sample we develop in this blog shows how to invoke a backing bean method while loading .jspx page using <af:clientListener> and <af:serverListener> components

To implement this we use java script , client & server listener components.

<af:clientListener> component invokes a java script method shown in second screen shot. This component accepts two parameters type and method. type accepts various values from the drop down like load, mouseDown, mouseUp, etc..  This component listen to the event as soon as event triggers this invoke javascript method. In this case 'load' is the event , while page loads this event triggers and invokes java script method.

Below java script method queues an event to server side. <af:serverListener> component listen to the events and as soon as serverListener receives an event it invokes a method defined in <af:serverListener>

Backing Bean method :
This method invokes as soon as after page Loads from the above <af:serverListener> property


    public void handleDisable(ClientEvent event) {
         // d1 is  top root element in jspx.
         disableControls(JSFUtils.findComponent("d1"), new Object[] { Boolean.TRUE }, Boolean.FALSE);
    }
Below method get the root element of the jspx page, and iterate through each child element and based on certain condition set disable property to 'true' or 'false'

Ref : http://tompeez.wordpress.com/tag/afclientlistener/