TOC

Exemple JSF 2.0 Ajax hello world

Exemple JSF 2.0 + Ajax Hello World

Dans JSF 2.0, coder Ajax est comme coder une balise HTML normale, c'est extrêmement facile. Dans ce tutoriel, vous allez restructurer les derniersJSF 2.0 hello world example, de sorte que, lorsque le bouton est cliqué, il fera une requête Ajax au lieu de soumettre le formulaire entier.

1. Page JSF 2.0

Une page xhtml JSF 2.0 avec support Ajax.

helloAjax.xhtml




    
        






JSF 2.0 + Ajax Hello World Example

Dans cet exemple, cela rend le bouton Ajaxable. Lorsque le bouton est cliqué, il fera une demande Ajax au serveur au lieu de soumettre le formulaire entier.

Dans la balise<f:ajax>:

  1. execute=”name” - Indiquez que le composant de formulaire avec un ID de «name» sera envoyé au serveur pour traitement. Pour plusieurs composants, divisez-le simplement avec un espace entre les deux, par exempleexecute=”name anotherId anotherxxId”. Dans ce cas, il soumettra la valeur de la zone de texte.

  2. render=”output” - Après la requête Ajax, il actualisera le composant avec un id de «output». Dans ce cas, une fois la requête Ajax terminée, il actualisera le composant<h:outputText>.

2. ManagedBean

Voir l'exemple complet de#{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. Comment ça marche?

Accéder à l'URL:http://localhost:8080/JavaServerFaces/helloAjax.jsf

jsf2-ajax-hello-world-example-1

Lorsque le bouton est cliqué, il fait une demande Ajax et transmet la valeur de la zone de texte au serveur pour traitement. Après cela, il actualise le composantoutputText et affiche la valeur via la méthodegetSayWelcome(), sans aucun «page flipping effect».

jsf2-ajax-hello-world-example-2

Télécharger le code source

Téléchargez-le -JSF-2-Ajax-Hello-World-Example.zip (8 Ko)

Related