Пример 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

Страница JSF 2.0 xhtml с поддержкой Ajax.

helloAjax.xhtml





    
        

JSF 2.0 + Ajax Hello World Example

В этом примере это делает кнопку Ajaxable. Когда кнопка нажата, она отправит Ajax-запрос на сервер вместо отправки всей формы.


    

В теге<f:ajax>:

  1. execute=”name” - указывает, что компонент формы с идентификатором «name» будет отправлен на сервер для обработки. Для нескольких компонентов просто разделите его пробелом между ними, напримерexecute=”name anotherId anotherxxId”. В этом случае он отправит значение текстового поля.

  2. render=”output” - после запроса Ajax он обновит компонент с идентификатором «output». В этом случае после завершения запроса 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;
       }
    }
}

3. Как это работает?

jsf2-ajax-hello-world-example-1

Когда кнопка нажата, она делает запрос Ajax и передает значение текстового поля на сервер для обработки. После этого он обновляет компонентoutputText и отображает значение с помощью методаgetSayWelcome() без какого-либо «page flipping effect».

jsf2-ajax-hello-world-example-2

Скачать исходный код

Скачать -JSF-2-Ajax-Hello-World-Example.zip (8KB)