Searching...
Thursday, 18 April 2013

JSF Value change Listener example

13:46
JSF 2 Value change listener
In JSF when user interacts with GUI components like h:inputText or h:selectOneMenu, the JSF triggers a change events .
This can be implemented in two ways.

1. Method binding- Create a method in managed bean and call this via valueChangeListener attributes

2. Using ValueChangeListener interface- Create a separate class which implements ValueChangeListener and implement processValueChange method.

Example using Method binding

1. Create a managed bean

package com.vinod.jsf;

import java.util.ArrayList;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.event.ValueChangeEvent;

/**
 * @author vinodkariyathungalkumaran
 *
 */

@RequestScoped
@ManagedBean
public class ChangeListenerBean {

    public ChangeListenerBean() {
    }
    private String country;
    private String updatedCountry;

    public String getUpdatedCountry() {
        return updatedCountry;
    }

    public void setUpdatedCountry(String updatedCountry) {
        this.updatedCountry = updatedCountry;
    }

    public String getCountry() {
        return country;
    }

    public void setCountry(String country) {
        this.country = country;
    }

    public ArrayList getCountries() {
        ArrayList countries = new ArrayList();
        countries.add("India");
        countries.add("Austria");
        countries.add("USA");
        return countries;
    }
    public void changeListernMethod(ValueChangeEvent e) {
        setUpdatedCountry("You selected " + e.getNewValue().toString());
    }

}

2. Create a xhtml page

<?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://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">
<head>
<title>My JSF Examples</title>
</head>
<body>
    <h2>valueChangeListener Examples (Method Binding)</h2>
    <h:form>
        <hr />
        <h:panelGrid columns="2">
            <h:selectOneMenu value="#{changeListenerBean.country}"
                onchange="submit()"
                valueChangeListener="#{changeListenerBean.changeListernMethod}">
                <f:selectItems value="#{changeListenerBean.countries}" />
            </h:selectOneMenu>
            <h:outputText id="country"
                value="#{changeListenerBean.updatedCountry}" />
        </h:panelGrid>
    </h:form>
</body>
</html>

3. Run it
http://localhost:8080/vinod-jsf/changeListener.xhtml



Example using ValueChangeListener interface

1. Create a change listener class which implements ValueChangeListener

package com.vinod.jsf;

import javax.faces.context.FacesContext;
import javax.faces.event.AbortProcessingException;
import javax.faces.event.ValueChangeEvent;
import javax.faces.event.ValueChangeListener;

public class MyChangeListener implements ValueChangeListener {

    @Override
    public void processValueChange(ValueChangeEvent event) throws AbortProcessingException {
       ChangeListenerBean changeListenerBean = (ChangeListenerBean) FacesContext.getCurrentInstance().
                getExternalContext().getRequestMap().get("changeListenerBean");
        System.out.println(changeListenerBean);
        System.out.println("Executin change listener");
        changeListenerBean.setUpdatedCountry("You Selected " +event.getNewValue());
    }
}

2. Create a xhtml page

<?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://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">
<head>
<title>My JSF Examples</title>
</head>
<body>
   
    <h:form>
        <h2>valueChangeListener Examples (Implements ValueChangeListener
            )</h2>
        <h:selectOneMenu value="#{changeListenerBean.country}"
            onchange="submit()">
            <f:valueChangeListener type="com.vinod.jsf.MyChangeListener" />
            <f:selectItems value="#{changeListenerBean.countries}" />
        </h:selectOneMenu>
        <h:outputText id="country1"
            value="#{changeListenerBean.updatedCountry}" />
    </h:form>
</body>
</html>

3. Run it


Done!! Download example
https://github.com/kkvinodkumaran/myrepository

0 comments: