Tutoriel JSF2 N°11 : JSF 2 avec Ajax

////Tutoriel JSF2 N°11 : JSF 2 avec Ajax

Découvrez l’impact de Ajax, natif à JSF depuis la version JSF 2.0, Mettez_le en œuvre dans un cas simple.

Objectifs

 Découvrir l’impacte des composants qui utilise Ajax.

 Mise en œuvre de Ajax sur le composant h:dataTable.

Programme

 Contexte et objectifs

 Partie 1 :découvrir l’impacte de Ajax

 Partie 2 : mise en œuvre de Ajax

Durée

30 min.

Contexte

 Pour pallier aux manques de composants JSF, on utilisait des librairies connues telles que RichFaces, IceFaces, PrimeFaces et autres. Ces bibliothèques ont fait leur preuves mais il était regrettable que JSF n’intègre pas ces fonctions de base. Avec JSF 2, Ajax, l’une des fonctions les plus demandées sur des applications riches, est désormais présente nativement. .

Partie 1 : découvrir l’impacte de Ajax

 Explorez le Tag ajax parmi la bibliothèque des tags

ajaxTag.png

Partie 2:Mise en œuvre de Ajax)

Remplacer le contenu du fichier register.xhtml du projet téléchargé, par celui ci-dessous:

register.xhtml

 Observez de plus près le tag Ajax

bouton Ajax

— Expliquer les attributs:

 render= »:formAjax:pnlResultat :formAjax:count »

 execute= »@form »

 event= »keyup »

 L’attribut actionListener= »userbean.rechercher » du bouton rechercher active un écouteur qui gère l’évènement rechercher des participants dont la méthode est contenu dans UserBean.

 Remplacer le contenu du fichier UserBean.java du projet téléchargé, par celui ci-dessous:

UserBean.java

 La méthode de recherche des participants.
methodeSerach.png

 Le déploiement du projet sur le serveur cible Tomcat donne le rendu ci-dessous.

vuePremiereAjax.png

 Mise à jour de la table et du nombre de participant trouvé par la recherche de:

 nom : Tango

 mail: nathalie@objis.com

mis à jourTableau et du nombre de participant avec Ajax

— La suppression de tous les participants de notre tableau met a jour notre vue comme sur l’image ci-dessous:

suppression de tous les participants

 Téléchargez le projet final ci-dessous:
Projet Final

Conclusion

 Dans ce tutoriel, vous avez compris et mis en œuvre le tag Ajax, pour rafraichir et traiter un endroit spécifique de votre page sans la recharger entièrement.

2018-01-29T17:20:36+01:00

Contactez nous

241 rue DUGUESCLIN, 69003 Lyon

Web : Objis : spécialiste formation Java