ADF; Notify the server when user tabs out of ADF input field

Though the use case covered in this section is more of an individual problem than of generic interest, the code involved to implement the solution may be useful. 

First the use case: For an input text component, a notification should be sent to the server when the user steps out of the field using mouse or the keyboard navigation. The notification should be sent no matter if users changed the field content (in which case a value change listener would have done) or not (in which case a value change listener is not enough). 

The solution to this problem is to use an af:clientListener tag on the input tag component to invoke a JavaScript function when the user leaves the field (The component event for this is "blur").

Using an af:serverListener tag on the input text component then allows to notify the server from the JavaScript function.

<f:view>
  <af:document id="d1"> 
    <af:resource type="javascript">
       function onBlurTxtField(evt){
          var source = evt.getSource(); 
          var custEvent = new AdfCustomEvent(source,"onBlurNotifyServer",
                       {submittedValue : source.getSubmittedValue(),
                        localValue : source.getValue()}
                         ,true);
          custEvent.queue(); 
       }
   </af:resource>
   <af:form id="f1">
     <af:inputText label="Label 1" id="it1">
        <af:clientListener   method="onBlurTxtField" type="blur"/>
        <af:serverListener   type="onBlurNotifyServer"
                             method="#{TxtHelper.onBlurNotify}"/>
     </af:inputText>
     <af:inputText label="Label 2" id="it2"/>
   </af:form>
  </af:document>  
</f:view>

The page code above sends a custom event to the server whenever a user leaves the input text field. 

The payload sent to the server contains the submitted and the local component value. Note that in the above sample --- as we will see next --- the payload is not really required because the same information can be accessed from the component instance in the referenced managed bean method.

<af:serverListener type="onBlurNotifyServer"
                   method="#{TxtHelper.onBlurNotify}"/>

The managed bean method receives a single argument of type ClienEvent:

public void onBlurNotify(ClientEvent clientEvent) {
    // get a hold of the input text component
    RichInputText inputTxt =  RichInputText) clientEvent.getComponent(); 
    //do some work on it here (e.g. manipulating its readOnly state)
    //…
    //Get access to the payload

   Map  parameters = clientEvent.getParameters();
   System.out.println("SubmittedValue = "+parameters.get("submittedValue"));
   System.out.println("LocalValue =  +parameters.get("localValue"));
}

As mentioned, the use case may not be of generic interest. However, the way you work with the client and server listener for sure made sense to publish as an example.