PrimeFaces Ajax Listener

This attribute is used to call Java method by using an Ajax request. It is an attribute of <a:ajax> component.

Here, we are creating an example that calls a method from ManagedBean. It includes the following files and code.

JSF File

// ajax-listener.xhtml

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Ajax Listener</title>
</h:head>
<h:body>
<h2>Ajax Listener Example</h2>
<h:form>
<h:panelGrid columns="3">
<h:outputText value="Enter: " />
<p:inputText id="counter" value="#{listenerBean.text}" placeholder="Enter Text">
<p:ajax event="keyup" update="out" listener="#{listenerBean.ajaxEvent()}" />
</p:inputText>
</h:panelGrid>
<h:panelGrid id="out">
<h2>Output</h2>
<h:outputText value="#{listenerBean.text}" />
</h:panelGrid>
</h:form>
</h:body>
</html>

Managed Bean

// ListenerBean.java

package com.javatpoint;
import javax.faces.bean.ManagedBean;
@ManagedBean
public class ListenerBean {
String text;
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public void ajaxEvent() {
text = text.toUpperCase();
}
}

Output: