JSF 2 valueChangeListenerの例
ユーザーが
h:inputText
または
h:selectOneMenu
のような入力コンポーネントを変更すると、JSFの ”
value change event
“が発生します。
それを実装する2つの方法:
<h:selectOneMenu value="#{bean.value}" onchange="submit()"
valueChangeListener="#{bean.valueChangeMethod}">
<f:selectItems value="#{bean.values}"/>
</h:selectOneMenu>
Java …
値変更イベントと対話するメソッドは、
ValueChangeEvent
パラメーターを受け入れる必要があります。
@ManagedBean(name="bean")
@SessionScoped
public class BeanBean{
public void valueChangeMethod(ValueChangeEvent e){
//...
}
}
-
2。 ValueChangeListenerインターフェース
– 入力コンポーネントで、 ”
f:valueChangeListener ** “タグを内部に追加し、ValueChangeListenerインターフェースの実装クラスを指定しました。
JSF …
<h:selectOneMenu value="#{bean.value}" onchange="submit()">
<f:valueChangeListener type="ValueListenerXXX"/>
<f:selectItems value="#{bean.values}"/>
</h:selectOneMenu>
__Java …
ValueChangeListener
インタフェースを実装し、
processValueChange()
メソッドをオーバーライドします。
public class ValueListenerXXX implements ValueChangeListener{
@Override
public void processValueChange(ValueChangeEvent event)
throws AbortProcessingException {
//...
}
}
-
注意
動作させるには、
onchange = “submit()” ** JavaScriptを入力コンポーネントに添付する必要があります。それ以外の場合は、イベントは発生しません。
完全なvalueChangeListenerの例
ここではドロップダウンボックス(
h:selectOneMenu
)とテキストボックス(
h:inputText
)を持つJSF 2.0アプリケーションがあり、ユーザーがドロップダウンボックスで変更を加えると、「値変更イベント」が発生し、新しく選択されたドロップダウンボックス値。
この例は、「
メソッドバインディング
」と「
ValueChangeListener
」の両方でのデモンストレーションです。
1.メソッドバインディング
デモンストレーションのための国とロケールコードのリストを提供するカントリーBean。 Beanのメソッドは、入力コンポーネントの ”
valueChangeListener
“属性を介してバインドできます。下記参照 :
CountryBean.java
package com.mkyong;
import java.io.Serializable;
import java.util.LinkedHashMap;
import java.util.Map;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.ValueChangeEvent;
@ManagedBean(name="country")
@SessionScoped
public class CountryBean implements Serializable{
private static final long serialVersionUID = 1L;
private static Map<String,String> countries;
private String localeCode = "en";//default value
static{
countries = new LinkedHashMap<String,String>();
countries.put("United Kingdom", "en");//label, value
countries.put("French", "fr");
countries.put("German", "de");
countries.put("China", "zh__CN");
}
public void countryLocaleCodeChanged(ValueChangeEvent e){
//assign new value to localeCode
localeCode = e.getNewValue().toString();
}
public Map<String,String> getCountryInMap() {
return this.countries;
}
public String getLocaleCode() {
return localeCode;
}
public void setLocaleCode(String localeCode) {
this.localeCode = localeCode;
}
}
JSFページ
<?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"
xmlns:ui="http://java.sun.com/jsf/facelets"
>
<h:body>
<h1>JSF 2 valueChangeListener example</h1>
<h:form>
<h:panelGrid columns="2">
Selected country :
<h:inputText id="country" value="#{country.localeCode}" size="20"/>
Select a country {method binding}:
<h:selectOneMenu value="#{country.localeCode}" onchange="submit()"
valueChangeListener="#{country.countryLocaleCodeChanged}">
<f:selectItems value="#{country.countryInMap}"/>
</h:selectOneMenu>
</h:panelGrid>
</h:form>
</h:body>
</html>
2. ValueChangeListenerインターフェース
country beanの上で再利用して、国とロケールコードのリストを提供します。
ValueChangeListener
インターフェースを実装し、 ”
f:valueChangeListener
“タグを介してバインドします。下記参照 :
CountryValueListener.java
package com.mkyong;
import javax.faces.context.FacesContext;
import javax.faces.event.AbortProcessingException;
import javax.faces.event.ValueChangeEvent;
import javax.faces.event.ValueChangeListener;
public class CountryValueListener implements ValueChangeListener{
@Override
public void processValueChange(ValueChangeEvent event)
throws AbortProcessingException {
//access country bean directly
CountryBean country = (CountryBean) FacesContext.getCurrentInstance().
getExternalContext().getSessionMap().get("country");
country.setLocaleCode(event.getNewValue().toString());
}
}
JSFページ
<?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"
xmlns:ui="http://java.sun.com/jsf/facelets"
>
<h:body>
<h1>JSF 2 valueChangeListener example</h1>
<h:form>
<h:panelGrid columns="2">
Selected country :
<h:inputText id="country" value="#{country.localeCode}" size="20"/>
Select a country {ValueChangeListener class}:
<h:selectOneMenu value="#{country.localeCode}" onchange="submit()">
<f:valueChangeListener type="com.mkyong.CountryValueListener"/>
<f:selectItems value="#{country.countryInMap}"/>
</h:selectOneMenu>
</h:panelGrid>
</h:form>
</h:body>
</html>
デモ
デフォルトでは、国「イギリス」が選択されています。
例:jsf2-ValueChangeListener-example-1、width = 640、height = 300]
国のドロップダウンボックス値が変更された場合は、
valueChangeListener
を発生させ、新しく選択したドロップドローボックス値でテキストボックス値を更新します。
例:jsf2-ValueChangeListener-example-2、width = 640、height = 300]
ソースコードをダウンロードする
ダウンロード – リンク://wp-content/uploads/2010/11/JSF-2-ValueChangeListener-Example.zip[JSF-2-ValueChangeListener-Example.zip](10KB)