読者です 読者をやめる 読者になる 読者になる

Challenge Java EE !

Java EEを中心に趣味や仕事における開発メモを書いています。

JSF2.2のresetValues属性が地味だけど強力…

JSF Java EE 7

Java EE7が出てJSF2.2になりましたが、ビッグチケットに隠れて気づかなかったのですがresetValue属性なるものが追加されていました(^^;

JSFで結構うっとおしいなぁと思う1つにバリデーションでエラーとなった後の挙動があると思うのですが、その際に有益な手段となりそうです。

元ネタ

以下ブログを参考に実際に試してみたので、まとめます。

JSF 2.2: Reset input fields
http://jsflive.wordpress.com/2013/06/20/jsf-22-reset-values/

上記ブログの例はわかりやすいので、そのまま日本語にしてプログラム作ってみました。
まず結果から。

挙動結果

プログラムは単純で、実行すると以下のような画面が初期表示されます。

f:id:kikutaro777:20131009200242j:plain

リンクを押下するたびにテキストの値がインクリメントされます。

f:id:kikutaro777:20131009200354j:plain

2つ目のテキストにはバリデーションがあって、10以下の値だとエラーになります。
保存ボタンを押してみると

f:id:kikutaro777:20131009200428j:plain

バリデーションメッセージが表示されてエラーになります。

さて、ここで再度リンクを押下してみます。すると、バリデーションエラーになっているため、インクリメントできません。

f:id:kikutaro777:20131009200509j:plain

あとでビュー定義を載せますが基本的に全てAjaxによる部分更新です。

で、これをJSF2.1で普通に作ると、リンクのimmediateをtrueにしてみて、でも画面更新されなくて…あれっ、あれっ、じゃあPrimeFaces使うか、みたいになったり…。

で、JSF2.2のresetValuesを使うと、ある1つの記述するだけで、以下のようにリンク押下でインクリメント処理が実行されます。

f:id:kikutaro777:20131009200926j:plain

地味に便利(^^)

ビューの定義

resetValuesを入れる前のビューは以下です。

<?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:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>ResetValuesの挙動確認</title>
    </h:head>
    <h:body>
        <h:form id="form">
            <h:messages id="msgs" />
            
            <h:inputText id="v1" value="#{bean.value1}" />
            <h:commandLink value="1を足す" action="#{bean.incValue1()}">
                <f:ajax render="v1" />
            </h:commandLink>
            
            <h:inputText id="v2" value="#{bean.value2}">
                <f:validateLongRange minimum="10" />
            </h:inputText>
            
            <h:commandButton value="保存">
                <f:ajax execute="v1 v2" render="msgs v1 v2" />
            </h:commandButton>
        </h:form>
    </h:body>
</html>

ちなみにBeanは以下のように単純です。

package jp.co.hoge.javaee7;

import javax.faces.view.ViewScoped;
import javax.inject.Named;

@Named
@ViewScoped
public class Bean {
    
    private int value1;
    
    private int value2;

    //setter,getter省略
  
    public void incValue1(){
        value1++;
    }
}

resetValues属性を入れる

で、インクリメント可能にするには、リンクの部分を

<h:commandLink value="1を足す" action="#{bean.incValue1()}">
    <f:ajax render="v1" />
</h:commandLink>

以下のように変更します。属性をtrueに指定するだけですね。

<h:commandLink value="1を足す" action="#{bean.incValue1()}">
    <f:ajax render="v1" resetValues="true"/>
</h:commandLink>

これだけ!

自分の所の開発は現在Java EE6でJSF2.1ですが、今すぐ欲しい…orz

ちなみに参考元のブログの最後に、ajaxではない場合にf:resetValuesがある、と書いてましたがNetBeans7.4RC1ではタグ自体がみえなかったので試してません(^^;

はやくJava EE7でJSF2.2使って開発したいなぁ。。。

にほんブログ村 IT技術ブログへ
にほんブログ村
にほんブログ村 IT技術ブログ Javaへ
にほんブログ村