JAVA SERVER FACES :

JSF VERSION 2
1
I. Comment dfinir le Jsf?
II. Les composants d une page jsf?
III. Cycle de vie dune page jsf?
IV. l'Expression Langage de JSF
V. Les convertisseurs et validateurs
VI. Configuration dun Bean managed
VII. Comment spcifier une rgle de
navigation (navigation-rule) ?

plan
2
Brve dfinition:
Java serverFaces(jsf) , est
un framework web MVC
qui met l'accent sur les
interfaces utilisateur de
l'application Web Java et
cre les composants
d'interface utilisateur
rutilisable facile mettre
en uvre.
3
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?


Une page JSF
Contient des parties en EL :
#{}

Utilise souvent une (ou
plusieurs)
bibliothque de composants,

Sera traduite en XHTML
pur pour tre envoye au
client Web,
JSF - page 4
I. Comment dfinir le
Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les convertisseurs
et validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier
une rgle de
navigation
(navigation-rule) ?



Les pages JSF ne
contiennent pas de
traitements
Les traitements lis
directement linterface
utilisateur sont crits dans les
managed beans,
5
I. Comment dfinir le
Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les convertisseurs
et validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier
une rgle de
navigation
(navigation-rule) ?



Suite :page jsf
Dans JSF 2.0, bean Java
qui peut tre accessible
partir de la page JSF est
appel Managed Bean . Il
existe deux faons de
configurer le bean gr:

6
I. Comment dfinir le
Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les convertisseurs
et validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier
une rgle de
navigation
(navigation-rule) ?



Suite:Page jsf
Bibliothques de balises JSF
URI Prfixe
classiq
ue
Description
http://java.sun.com/
jsf/html
h Contient les composants et
leurs rendus HTML
(h:commandButton, h:inputText,
etc.)
http://java.sun.com/
jsf/core
f Contient les actions
personnalises indpendantes
d'un rendu particulier
(f:convertNumber,
f:validateDoubleRange,
f:param, etc.)
http://java.sun.com/
jsf/facelets
ui Marqueurs pour le support des
modles de page.
http://java.sun.com/
jsf/composite
compo
site
Sert dclarer et dfinir des
nouveaux composants
personnaliss.
http://java.sun.com/
jsp/jstl/core
c Les pages Facelets peuvent
ventuellement utiliser certains
marqueurs issus de JSP (c:if,
c:forEach et
c:catch).
http://java.sun.com/
jsp/jstl/functions
fn Les pages Facelets peuvent
utiliser tous les marqueurs de
fonctions issus de la
technologie JSP.
7
I. Comment dfinir le
Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les convertisseurs
et validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier
une rgle de
navigation
(navigation-rule) ?





8
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



convertion
validation
Le cycle de vie des JSF

L'Expression Language (EL)
Les expressions EL peuvent utiliser la plupart
des oprateurs Java habituels :

1. Arithmtiques : + - * / (division) % (modulo)
2. Relationnels : == (galit) != (ingalit) <
(infrieur) > (suprieur) <= (infrieur ou gal)
>= (suprieur ou gal)
3. Logiques : && (et) || (ou) ! (non)
4. Autre : empty (vide) () (parenthses) [ ]
(crochets) . (sparateur) ?: (if arithmtique)
9
I. Comment dfinir
le Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les
convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment
spcifier une rgle
de navigation
(navigation-rule) ?



convertisseur
Permet la conversion des
donnes ;
IHM VERS ManagedBean
Ou ManagedBean vers IHM

Exemple :convertisseurs de
date et de nombre



10
I. Comment dfinir le
Jsf?
II. Les composants d
une page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression
Langage de JSF
V. Les convertisseurs
et validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier
une rgle de
navigation
(navigation-rule) ?



import
javax.faces.convert.Converter;
public class URLConverter
implements Converter{
//... }




1. getAsObject(),
2. getAsString(),
11
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



Convertisseur personalis
public class PersonConverter
implements Converter
{
public Object
getAsObject(FacesContext context,
UIComponent component, String
value)
{ return null; }
public String
getAsString(FacesContext context,
UIComponent component, Object
value)
{ Person person = (Person) value;
return person.getFirstName() + " " +
person.getLastName() + " " +
person.getAge();
}
}
12
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



<converter>
<converterid>
personConverter
</converter-id>
<converterclass>

converters.PersonConverter
</converter-class>
</converter>
13
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



La validation des donnes
1)Les classes de validation
standard:
Toutes ces classes implmentent l'interface
javax.faces.validator.Validator
deux classes de validation sur une plage de donnes :
LongRangeValidator et DoubleRangeValidator
une classe de validation de la taille d'une chane de
caractres : LengthValidator







Toutes les validations sont faites ct serveur dans la version
courante de JSF.
Les messages d'erreurs issus de ces conversions peuvent
tre affichs en utilisant les tags <message> ou
<messages>.
Ils contiennent une description par dfaut selon le validator
utilis commenant par Validation error : .



14
Exemple :
<h:inputText id="nombre" converter="#{Integer}"
required="true"
value="#{saisieDonnees.nombre}">
<f:validate_longrange minimum="1"
maximum="9" />
</h:inputText>
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



Ces validations sont
effectues ct serveur.
2)Contourner la validation:


15
<h:commandButton
value="Annuler" action="annuler"
immediate="true"/>
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



excution
sans
validation
16
I. Comment dfinir le
Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune
page jsf?
IV. l'Expression Langage
de JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun
Bean managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



3)classe de validation personnalises

1)Crer une classe qui implmente
l'interface javax.faces.validator.Validator .

2)Dclarer cette classe dans faces-config.xml
Exo:public class PersonValidator
implements Validator
<validator> <validator-
id>personValidator</validator-id>
<validator-
class>validators.PersonValidator</vali
dator-class> </validator>

3)<h:inputText value="#{control.name}" id="name">
<f:validator validatorId="personValidator" /> </h:inputText>
Un Bean Managed configurer avec
l'annotation

package com.mkyong.common ;
import javax.faces.bean.ManagedBean ;
import javax.faces.bean.SessionScoped ;
import java.io.Serializable ;
@ ManagedBean
@ SessionScoped
publique classe HelloBean implmente
Serializable
{ priv statique finale longue
serialVersionUID = 1L ;
priv cordes nom ;
publique Chane getName ( )
{
retour nom ; }
publique vide setName ( chane nom )
{ ce . nom = nom ;
}
}
17
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



DESCRIPTION DES ANNOTATIONS DES BEANS
MANAGS

@ManagedBean (sur la
classe) : dfinit la classe
comme un managed bean,
il prend par dfaut le nom
de la classe premire lettre
en minuscule.

18
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



@ManagedProperty (sur
les attributs) : permet de
dfinir une valeur par
dfaut lattribut (appelle
alors le setter qui doit
exister).
19
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



DESCRIPTION DES ANNOTATIONS DES BEANS MANAGS

@NoneScoped:B
@RequestScoped
@ViewScoped
@SessionScoped
@ApplicationScoped
@CustomScoped

20
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



2. Bean configurer Gr avec
XML

<?xml version = "1.0" encoding = "UTF-8" ?>
<faces-config
xmlns = http://java.sun.com/xml/ns/javaee
xmlns:xsi = "http://www.w3.org/2001/XMLSchema-
instance"
xsi:schemaLocation =
http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-
facesconfig_2_0.xsd
version = "2.0" >
<managed-bean >
<managed-bean-name > helloBean </managed-
bean-name >
<managed-bean-class >
com.mkyong.common.HelloBean </managed-bean-
class> <managed-bean-scope > session
</managed-bean-scope >
</managed-bean > </faces-config >
21
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<display-name>JSFReg</display-name>
<description>Application exemple pour la saisie de
formulaire</description>
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>faces/register.xhtml</welcome-file>
</welcome-file-list>
</web-app>
Web.xml
22
Navigation Implicite Dans JSF
2.0

... <navigation-rule >
<from-view-id > page1.xhtml
</from-view-id> <navigation-case
>
<from-outcome > page2 </from-
outcome > <to-view-id >
/page2.xhtml </to-view-id >
</navigation-case >
</navigation-rule > ...
23
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



Il ya deux faons de implmente la navigation implicite
dans JSF 2:

Navigation statique





Rsultat dans Managed Bean(Navigation
dynamique)

Exemple: bean ger PageController.java













<h:form> <h: commandButton l'action = "page2"
valeur = "Dplacer vers page2.xhtml" / > < / h:
form>
@ ManagedBean @ SessionScoped publique
classe PageController implmente
Serializable { publique Chane moveToPage2
( )
{ retour "page2" ; / / rsultat } }
<h:form> <h: commandButton l'action =
"#{pageController.moveToPage2}" valeur =
"Dplacer vers page2.xhtml par bean gr" / >
< / h: form>
24
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



Acces
une
couche
metier
Un bean gr, avec deux actions qui renvoient un
mme rsultat - "succs".

exemple:
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import java.io.Serializable;
@ManagedBean
@SessionScoped
public class PageController implements
Serializable
{ private static final long serialVersionUID = 1L;
public String processPage1(){ return "success"; }
public String processPage2(){ return "success"; }
}}
25
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



Jsf page
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<h:body>
<h2>This is start.xhtml</h2>
<h:form>
<h:commandButton
action="#{pageController.processPage1}"
value="Page1" />
<h:commandButton
action="#{pageController.processPage2}"
value="Page2" />
</h:form>
</h:body>
</html>
26
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-
facesconfig_2_0.xsd" version="2.0">
<navigation-rule>
<from-view-id>start.xhtml</from-view-id>
<navigation-case>
<from-action>#{pageController.processPage1}</from-
action>
<from-outcome>success</from-outcome>
<to-view-id>page1.xhtml</to-view-id>
</navigation-case> <navigation-case>
<from-action > #{pageController.processPage2}</from-
action>
<from-outcome>success</from-outcome> <to-view-
id>page2.xhtml</to-view-id>
</navigation-case> </navigation-rule> </faces-config>
27
I. Comment dfinir le Jsf?
II. Les composants d une
page jsf?
III. Cycle de vie dune page
jsf?
IV. l'Expression Langage de
JSF
V. Les convertisseurs et
validateurs
VI. Configuration dun Bean
managed
VII. Comment spcifier une
rgle de navigation
(navigation-rule) ?



faces-config
28
Feces

servlet
Moteur
de
rendu
XUL






JSP





XHTML






composant
composant
composant
Bean gr
convertisseur
convertisseur
navigation
Requette
http
Reponse
http
Rsum:
conclusion
29
Suivant
primefaces

Plan :

Introduction
Historique
Commencer avec PrimeFaces
UI composants
Thmes
PrimeMobile
Limites de PRIMEFACES
Conclusion

30
Introduction :


Le dveloppement dinterface web avec JSF tait limit cause de
peu de composants graphiques disponibles .


A cause de ce manque de composants, de nombreux projets ont t
lanc afin de crer des bibliothques de composants JSF plus ou
mois spcifiques .



Cest quoi PrimeFaces ?

31













32
PrimeFaces est une bibliothque open source de composants
JSF .

Il est bas ct serveur sur lAPI standard de JSF 2.


Cot client les scripts de PrimeFaces sont bass sur la librairie la
plus populaire de javascript jQuery .





PrimeFaces vise garder le traitement propre,
rapide et lger.

33

Qui a dvelopp PRIMEFACES ?







PrimeFaces est maintenu par Prime Teknoloji , une
entreprise de logiciels Turque de dveloppement spcialise
dans Agile et Java EE conseil.

34

Historique :



Novembre 2008 - dmarrage
Janvier 2009 Premire version 0.8.0
Plus que 15 versions jusqu prsent
Fvrier 2011-2.2.1(Dernire version stable)
Novembre 2011 3.0.M4(Dernire version non stable)
2012_2013 4.0..
2013_2014 4.3.1
2014_2015 5.0
35
Les concurrents de PRIMEFACES :

RichFaces

ICEfaces

Tomahawk

RCFaces

OpenFaces





36

PRIMEFACES VS RICHFACES



PrimeFaces RichFaces
Dbut partir de
2009
partir de
2006
Documentation ++ ++++
Composants ++++ ++
Facilit
dintgration
++++ ++
Mise en route Facile Plus complexe
Nouveaut de
composants
++++ ++
37
Commencer avec PrimeFaces :

Dpendances :
PrimeFaces exige seulement
-un runtime Java 5+
-JSF 2.0

Il y a certaines bibliothques en option pour certaines fonctions.
Comme par exemple :

Itext (2.1.7)

Apache
poi (5.0-FINAL)
38
Tlchargement :
PrimeFaces peut tre tlcharg soit :

Manuellement :
primefaces-
{version}.jar

http://www.primefaces.org/downloads.html

Via Maven :











<repository>
<id>prime-repo</id>
<name>PrimeFaces Maven Repository
</name>
<url>http://repository.primefaces.org
</url>
<layout>default</layout>
</repository>
<dependency>
<groupId>org.primefaces</groupId>
<artifactId>primefaces</artifactId>
<version>2.2</version>
</dependency>
39
Configuration :
xmlns:p="http://primefaces.prime.com.tr/ui"











Remarque :
A partir de la version 3.0.M4 on utilise :
xmlns:p="http://primefaces.org/ui
<html xmlns=http://www.w3.org/1999/xhtml
"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/
ui">

<h:head>
</h:head>
<h:body>
//content
</h:body>
</html>

40

UI composants :

Ensemble riche de composants : +100

Personnalisables et faciles utiliser

Compatibles avec dautre bibliothques

Composants lgres et simples intgrer

Composants base de jQuery



41

(+100 composants ) :












42
Thmes (+30 thmes prdfinies ) :

















43
Installer un thme :
Ajout de:
primefaces-{themename}.jar



Via Maven






Configuration:



<dependency>
<groupId>org.primefaces.themes<
/groupId> <artifactId>
themename </artifactId>
<version>1.0.2</version>
</dependency>

<context-param>
<param-name>primefaces.THEME</param-
name>
<param-value>cupertino</param-value>
</context-param>
44
45
http://jqueryui.com/themeroller/
Personnaliser votre thme
Integration avec Java EE :

PrimeFaces peut tre soutenu par plusieurs Framworks
dapplication d'entreprise:


Spring Core
Spring WebFlow
EJBs
..




46

PrimeFaces Mobile :

PrimeFaces Mobile est un kit dinterface utilisateur aliment par
Jquery Mobile pour crer des applications JSF optimis pour les
appareils mobiles.

Anciennement appel TouchFaces(avec PrimeFaces 2.2)










47
PrimeFaces Mobile est inclus dans PrimeFaces donc
aucune configuration supplmentaire n'est requise autre que
la taglib primefaces mobile.













Remarque :
on utilse : xmlns:i="http://primefaces.prime.com.tr/touch avec
TouchFaces(ancienne version avec primefaces 2.2 )
<f:view
xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:pm="http://primefaces.org/mobile"
>
<i:application>
//content
</i:application>
</f:view>
48
Limites de PRIMEFACES:

Manque de documentation





Bugs et problmes dans quelques composants










49
Conclusion :






50