Jsf-valuechangelistener-tag
提供：Dev Guides
JSF-valueChangeListener
ユーザーがh：inputTextやh：selectOneMenuなどの入力コンポーネントを操作すると、JSFはvalueChangeEventを起動します。これは2つの方法で処理できます。
| S.No | Technique & Description |
|---|---|
| 1 |
Method Binding UIコンポーネントの_valueChangeListener_属性でマネージドBeanメソッドの名前を渡します。 |
| 2 |
ValueChangeListener ValueChangeListenerインターフェイスを実装し、実装クラス名をUIコンポーネントの_valueChangeListener_属性に渡します。 |
メソッドのバインド
メソッドを定義する
public void localeChanged(ValueChangeEvent e) {
//assign new value to country
selectedCountry = e.getNewValue().toString();
}上記の方法を使用してください
<h:selectOneMenu value = "#{userData.selectedCountry}" onchange = "submit()"
valueChangeListener = "#{userData.localeChanged}" >
<f:selectItems value = "#{userData.countries}"/>
</h:selectOneMenu>ValueChangeListener
ValueChangeListenerを実装する
public class LocaleChangeListener implements ValueChangeListener {
@Override
public void processValueChange(ValueChangeEvent event)
throws AbortProcessingException {
//access country bean directly
UserData userData = (UserData) FacesContext.getCurrentInstance().
getExternalContext().getSessionMap().get("userData");
userData.setSelectedCountry(event.getNewValue().toString());
}
}リスナーメソッドを使用する
<h:selectOneMenu value = "#{userData.selectedCountry}" onchange = "submit()">
<f:valueChangeListener type = "com.finddevguides.test.LocaleChangeListener"
/>
<f:selectItems value = "#{userData.countries}"/>
</h:selectOneMenu>応用例
テストJSFアプリケーションを作成して、JSFのvalueChangeListenerをテストしましょう。
| Step | Description |
|---|---|
| 1 | Create a project with a name helloworld under a package com.finddevguides.test as explained in the JSF - First Application chapter. |
| 2 | Modify UserData.java file as explained below. |
| 3 | Create LocaleChangeListener.java file under a package com.finddevguides.test. Modify it as explained below. |
| 4 | Modify home.xhtml as explained below. Keep the rest of the files unchanged. |
| 5 | Compile and run the application to make sure the business logic is working as per the requirements. |
| 6 | Finally, build the application in the form of war file and deploy it in Apache Tomcat Webserver. |
| 7 | Launch your web application using appropriate URL as explained below in the last step. |
UserData.java
package com.finddevguides.test;
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 = "userData", eager = true)
@SessionScoped
public class UserData implements Serializable {
private static final long serialVersionUID = 1L;
private static Map<String,String> countryMap;
private String selectedCountry = "United Kingdom";//default value
static {
countryMap = new LinkedHashMap<String,String>();
countryMap.put("en", "United Kingdom");//locale, country name
countryMap.put("fr", "French");
countryMap.put("de", "German");
}
public void localeChanged(ValueChangeEvent e) {
//assign new value to country
selectedCountry = e.getNewValue().toString();
}
public Map<String, String> getCountries() {
return countryMap;
}
public String getSelectedCountry() {
return selectedCountry;
}
public void setSelectedCountry(String selectedCountry) {
this.selectedCountry = selectedCountry;
}
}LocaleChangeListener.java
package com.finddevguides.test;
import javax.faces.context.FacesContext;
import javax.faces.event.AbortProcessingException;
import javax.faces.event.ValueChangeEvent;
import javax.faces.event.ValueChangeListener;
public class LocaleChangeListener implements ValueChangeListener {
@Override
public void processValueChange(ValueChangeEvent event)
throws AbortProcessingException {
//access country bean directly
UserData userData = (UserData) FacesContext.getCurrentInstance().
getExternalContext().getSessionMap().get("userData");
userData.setSelectedCountry(event.getNewValue().toString());
}
}home.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://java.sun.com/jsf/html"
xmlns:f = "http://java.sun.com/jsf/core">
<h:head>
<title>JSF tutorial</title>
</h:head>
<h:body>
<h2>valueChangeListener Examples</h2>
<h:form>
<h2>Method Binding</h2>
<hr/>
<h:panelGrid columns = "2">
Selected locale :
<h:selectOneMenu value = "#{userData.selectedCountry}"
onchange = "submit()"
valueChangeListener = "#{userData.localeChanged}" >
<f:selectItems value = "#{userData.countries}"/>
</h:selectOneMenu>
Country Name:
<h:outputText id = "country" value = "#{userData.selectedCountry}"
size = "20"/>
</h:panelGrid>
</h:form>
</h:body>
</html>すべての変更を完了したら、JSF-最初のアプリケーションの章で行ったようにアプリケーションをコンパイルして実行します。 すべてがアプリケーションで問題ない場合、次の結果が生成されます。
JSF valueChangeListener result
ロケールを選択します。 次の結果が表示されます。
JSF valueChangeListener result1
以下に説明するように、アプリケーションをデプロイしたデプロイ済みディレクトリで home.xhtml を再度変更します。 残りのファイルは変更しないでください。
home.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://java.sun.com/jsf/html"
xmlns:f = "http://java.sun.com/jsf/core">
<h:head>
<title>JSF tutorial</title>
</h:head>
<h:body>
<h2>valueChangeListener Examples</h2>
<h:form>
<h2>ValueChangeListener interface</h2>
<hr/>
<h:panelGrid columns = "2">
Selected locale :
<h:selectOneMenu value = "#{userData.selectedCountry}"
onchange = "submit()">
<f:valueChangeListener
type = "com.finddevguides.test.LocaleChangeListener"/>
<f:selectItems value = "#{userData.countries}"/>
</h:selectOneMenu>
Country Name:
<h:outputText id = "country1" value = "#{userData.selectedCountry}"
size = "20"/>
</h:panelGrid>
</h:form>
</h:body>
</html>すべての変更を完了したら、ブラウザでページを更新します。 すべてがアプリケーションで問題ない場合、次の結果が生成されます。
JSF valueChangeListener result2
ロケールを選択します。 次の結果が表示されます。
