JSF 2.0 Ajax hello worldの例

JSF 2.0 + Ajax Hello Worldの例

JSF 2.0では、Ajaxのコーディングは通常のHTMLタグのコーディングに似ており、非常に簡単です。このチュートリアルでは、最後のJSF 2.0 hello world exampleを再構築して、ボタンがクリックされたときに、フォーム全体を送信する代わりにAjaxリクエストを作成するようにします。

1. JSF 2.0ページ

AjaxをサポートするJSF 2.0 xhtmlページ。

helloAjax.xhtml




    
        




JSF 2.0 + Ajax Hello World Example

この例では、ボタンをAjaxableにします。ボタンをクリックすると、フォーム全体を送信する代わりに、サーバーにAjaxリクエストを送信します。

<f:ajax>タグ内：

execute=”name” –「name」のIDを持つフォームコンポーネントが処理のためにサーバーに送信されることを示します。複数のコンポーネントの場合は、間にスペースを入れて分割します（例：execute=”name anotherId anotherxxId”）。この場合、テキストボックスの値を送信します。
render=”output” – Ajaxリクエストの後、「output」のIDでコンポーネントを更新します。この場合、Ajaxリクエストが終了すると、<h:outputText>コンポーネントが更新されます。

2. ManagedBean

完全な#{helloBean}の例を参照してください。

HelloBean.java

package com.example.common;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

import java.io.Serializable;

@ManagedBean
@SessionScoped
public class HelloBean implements Serializable {

    private static final long serialVersionUID = 1L;

    private String name;

    public String getName() {
       return name;
    }
    public void setName(String name) {
       this.name = name;
    }
    public String getSayWelcome(){
       //check if null?
       if("".equals(name) || name ==null){
        return "";
       }else{
        return "Ajax message : Welcome " + name;
       }
    }
}