Dveloppement

des applications web

avec J2EE
Ralis par:
Jihed DGHAIES
Copyright club CFEM 2010

JSF et RichFaces

Programme
1

JSF

Cycle JSF

Intgration de JSF dans un projet J2EE

Cration page JSF

5
3

Managed Bean

Validators et converters

7
3

Richfaces
2/29

JSF 1/3
La technologie JSF reprsente un Framework bas sur les
composantes utilisateurs utilises pour construire des applications web.

LAPI de JSF permet de reprsenter les composants, de grer leur tat

et leur comportement. Elle facilite lcriture dinterfaces utilisateurs en
fournissant une bibliothque de contrles :
Simples : zones de saisie classiques, boutons, liens hypertextes.
Complexes : tableaux de donnes

Elle permet mme de crer ses propres composants, ou denrichir les

composants existants.
3/29

JSF 2/3
JSF permet principalement de:
Faciliter le dveloppement de pages web grce un Framework bas sur les
composants.

reprsenter les composantes UI et grer leurs tats.

Gestion dvnements.
Validation cot serveur.
Conversion de donnes.

Dfinition de la navigation des pages.

grer les composantes et les lier aux objets cot serveur.
4/29

JSF 3/3
il existe plusieurs implmentations de JSF :
Myfaces
RichFaces

Icefaces
Tomahawk
Trinidad

Pour plus de dtails : http://www.jsfmatrix.net/

5/29

Cycle JSF

6/29

Intgration de JSF dans un projet J2EE 1/2

La premire tape faire lorsquon veut utiliser les ServerFaces est
de dfinir le mapping avec l'instance de FacesServlet dans le fichier
de dploiement web.xml.

Toutes les pages contenant le mapping /faces/ seront interprtes

par le serveur comme contenant des composants JSF.
7/29

Intgration de JSF dans un projet J2EE 2/2

Aprs avoir dclar la servlet de JSF on dclare le chemin de fichier

de configuration de JSF faces-config.xml .

le nom et l'emplacement du fichier de configuration de JSF facesconfig.xml sont spcifis par un paramtre de contexte dans web.xml.

Le chemin vers ce fichier est un chemin relatif partir de la racine de

l'application.

8/29

Cration Page JSF 1/2

la cration dune page JSF se rsume :
Ajouter les librairies contenant les TagLibs JSF :

l'intgration des composants et dfinir quel Bean chaque composant est

reli.

Les JSF se prsentent sous la forme d'un arbre de composants

appel une "vue". La balise "view" correspond la racine de cet
arbre et contiendra tous les composants.

le formulaire qui contient toutes les informations transmises au

serveur lorsque le formulaire sera envoy, via un clique sur un
bouton en gnral.

9/29

Cration Page JSF 2/2

10/29

Managed Bean 1/4

Un bean est une classe Java qui comprend :
Un constructeur vide.
Des mthodes publique de lecture et de modification de ses attributs (getXXX et
setXXX) et aucun attribut public.

Un bean manag est un bean :

dont la vie est gre par JSF.

dclar dans le fichier de configuration faces-config.xml.

Ayant un scope.

Les beans manags sont utiles pour afficher les donnes provenant
de la couche mtier ou pour la saisie de donnes par l'utilisateur.

11/29

Managed Bean 2/4

12/29

Managed Bean 3/4

13/29

Managed Bean 4/4

14/29

Navigation rules 1/2

Les navigations rules permettent de dfinir la manire de

naviguer entre les diffrentes pages JSF.

15/29

Navigation rules 2/2

16/29

Validateurs
Afin de vrifier si la saisie utilisateur est valide JSF fournit des Validator.

Validateurs fournies
par dfaut en JSF

17/29

Validateurs : Managed Bean

18/29

Validateur : Cration dun validateur

19/29

Les Converters

La conversion des donnes est le processus de

conversion ou de transformation dun type de donnes
un autre.

20/29

Converter : Cration converter

21/29

Richfaces
Richfaces est n du besoin d'associer la technologie Ajax celle
de JSF.

il comporte un ensemble de composants permettant d'ajouter des

fonctionnalits Ajax avances aux composants standards JSF
sans manipulation du code JavaScript.

Richfaces permet aussi denrichir les composants graphiques de

JSF et dajouter des nouveaux composants.

22/29

Richfaces

23/29

Intgration Richfaces

24/29

Format page richfaces

Pour ajouter les balises richfaces dans une page JSP on

ajoute lentte de la page les taglib A4J et Rich.

La bibliothque a4j( Ajax for JSF) permet djouter des

traitement Ajax aux pages JSF.

La bibliothque rich contient les composant graphiques de

richfaces .

25/29

Les composants ajax: a4j:support

A4J:support :Le plus connu et le plus utile des composants Ajax4jsf,
il permet d'ajouter le support Ajax aux composants JSF de base. parmi
ces attributs :

event : l'vnement javascript qui lance la requte Ajax

reRender : contient les ids des composants mettre jours lors du retour de la
rponse.
action : la mthode qui invoque l'action de l'application
ajaxSingle: pour limiter le passage par les phases decode, validation/conversion,
apply values, seulement au composant qui envoie la requte.
oncomplete: code excuter cot client la fin de la requte
26/29

Les composants ajax

<a4j:commandButton /> : Similaire h: commandButton, mais

gnre une requte Ajax et fait la mise jour des composants inclus
dans l'attribut reRender.

<a4j:region/> : Il permet de dfinir la zone de composants qui seront

traits cot serveur pour une requtes Ajax. Par dfaut, la page
entire est prise en compte.

<a4j:keepAlive/>: Permet de garder en vie un managedBean dclar

dans le scope request entre plusieurs requte Ajax.

27/29

Les composants graphiques richfaces

http://livedemo.exadel.com/richfaces-demo/index.jsp

28/29

Richfaces skins
Richfaces propose un systme de styles appel skin pour habiller
les composants Richfaces et JSF.

Les skins disponibles par dfaut sont :

DEFAULT ,plain ,emeraldTown ,blueSky ,wine ,japanCherry ,ruby ,
classic et deepMarine

29/29