PrimeFaces AjaxBehavior Example

AjaxBehavior is an extension to standard of f:ajax. As already mentioned at the JavaServer Faces 2 Tutorial, different components have used the f:ajax for ajaxifying the component’s behavior. If you’ve looked into section JSF and AJAX in the JSF 2 tutorials post, you’ll find different components having attached f:ajax for ajaxiyfing purpose.

Typically, AjaxBehavior act as the same way that the f:ajax provides, in that it’s attached to the primefaces components to ajaxify. As you will find within primefaces components series, the events will be listed and clarified at the time which the component has coming into discussion.

Read : PrimeFaces Tutorials

In this tutorial, I will explain how to use AjaxBehavior class and its attributes for handling the AJAX request. This class will be used with the ajax tags in the primefaces component.

1. AjaxBehavior Info

2. AjaxBehavior Attributes

3. Managed Bean

AjaxBehavior.java

package net.javabeat.primefaces;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.AjaxBehaviorEvent;

@ManagedBean
@SessionScoped
public class AjaxBehavior {
	private String message;

	public String getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}

	public void listener(AjaxBehaviorEvent e){
		System.out.println(e);
	}
}

Note listener defined method that accept AjaxBehaviorEvent as parameter

4. The View

index.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	<h:head>
		<script name="jquery/jquery.js" library="primefaces"></script>
	</h:head>
	<f:view>
		<h:form prependId="false">
			<h1>JavaBeat Primefaces Example</h1>
			<h2>Primefaces AjaxBehavior - Sample</h2>
			<h:outputText value="Type a message: "/>
			#{' '}
			<p:inputText id="in" value="#{ajaxBehavior.message}">
				<p:ajax process="in" update="out" event="blur" listener="#{ajaxBehavior.listener}"></p:ajax>
			</p:inputText>
			#{' '}
			<p:outputLabel id="out" value="#{ajaxBehavior.message}"/>
		</h:form>
	</f:view>
</html>

Primefaces JavaScript (jquery.js) library that used are defined within Primefaces JAR file.

5. PrimeFaces AjaxBehavior Example Demo

The below snapshots shows you the result of assuming use for primefaces input component either the result of the ajax behavior itself for blur client event or the listener that used for listening the ajax event.

[wpdm_file id=62]

1. AjaxBehavior Info

2. AjaxBehavior Attributes

3. Managed Bean

4. The View

5. PrimeFaces AjaxBehavior Example Demo

About Amr Mohammed

Reader Interactions

Leave a Reply Cancel reply