novembre
2007
Un article de djo.mos
Bonjour.
Ce billet est une sorte d’introduction rapide au développement Ajax avec JSF via la bibliothèque JBoss RichFaces.
Pour ce faire, je vous propose de réaliser étape par étape la célèbre application exemple SayHello.
Cette application se contente de récupérer le nom entré par l’utilisateur pour ensuite le saluer (Hello $nom).
Pour commencer, dans eclipse Europa + WTP 2.0.1, il faut créer un projet « Dynamic Web Project » en prensant soin d’inclure dans les librairies du projet les 3 fichiers jars de Rich Faces 3.1.2 GA téléchargeables ici.
Ajaxifier son application JSF avec RichFaces revient juste à ajouter ces 3 fichiers jars dans le classpath de l’applciation (WEB-INF/lib) ainsi qu’à modifier web.xml en ajoutant ces quelques lignes:
(juste après l’élément display-name).
<filter>
<display-name>RichFaces Filter</display-name>
<filter-name>richfaces</filter-name>
<filter-class>org.ajax4jsf.Filter</filter-class>
</filter>
<filter-mapping>
<filter-name>richfaces</filter-name>
<servlet-name>Faces Servlet</servlet-name>
<dispatcher>REQUEST</dispatcher>
<dispatcher>FORWARD</dispatcher>
<dispatcher>INCLUDE</dispatcher>
</filter-mapping>
Attaquons maintenant le jeu. On commence par créer un simle POJO (le managed bean) qui servira à stocker le nom saisi par l’utilisateur:
public class HelloBean {
private String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
On déclare ensuite ce bean dans faces-config.xml pour qu’il soit accessible depuis les pages JSF:
<managed-bean>
<managed-bean-name>helloBean</managed-bean-name>
<managed-bean-class>HelloBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
On crée ensuite une première pages (index.jsp) qui se contente de « forwarder » vers la page JSF:
<jsp:forward page="hello.jsf" />
Enfin, on arrive aux choses sérieuses: du JSF et de l’AJAX. Dans la page hello.jsp, et à l’intérieur de l’élément view:
<h:outputText value="Name :" />
<h:form>
<h:inputText value="#{helloBean.name}">
<a4j:support event="onchange" reRender="greeting" />
</h:inputText>
</h:form>
<h:outputText id="greeting" value="Hello #{helloBean.name} !" />
Toute la magie de la chose est réalisée par le <a4j:support>. Il permet d’ajaxifier n’importe quel composant JSF standard. Ce composant est très flexible et a de nombreux usages, mais dans ce cas particulier, on l’a utilisé pour capturer l’évènement onchange (javascript), formuler une requête AJAX et redessiner le composant outputText (reRender= »greeting ») à la reception d’une réponse à cette requête. C’etait le comportement côté client. Côté serveur, RichFaces s’occupe de décoder la requête AJAX, mettre à jour le champ « name » de notre managed bean et formuler la réponse.
C’etait un aperçu rapide de la simplicité et la puissance de RichFaces.
Comptez sur moi pour d’autres exemples dans les prochains billets.
Bonjour.
Oui, en effet, l’import du taglib d’ajax4jsf manque:
<%@taglib uri= »http://richfaces.org/a4j » prefix= »a4j »%>
Il ne manquerait l’import des taglibs ?
Je suis en train de découvrir Ajax4jsf, c’est vrai que ca a l’air d’etre hyper simple et pratique
J’ai hate de lire tes prochains posts sur le sujet