Formation JSP Java Server Faces

8/18/2019 Formation JSP Java Server Faces

1/89

Formation

Java Server Faces

1

Participant : Mr Frédéric MULLER

www.objis.com - Formation JEE/JSF – Groupement Informatique


2/89

www.objis.com - INTEGRTI!N "!NT

INUEwww.ob is.com - Formation #PRING

SOMMAIRER

app$%s &'EE p (

Positionn$m$nt F $t arc)it$ct*r$ p +",c%$ d$ i$ F p '1

Paca/$s c%és $t composants F nati0s p '(

"omposants s*pp%ém$ntair$s Ric)Fac$s p '

"omposants s*pp%ém$ntair$s : Ic$Fac$s p ('

E2$mp%$ cinémati3*$ app%ication F p (+

Prob%émati3*$ P 4 F $t répons$ Fac$%$t p 55

E2$mp%$ mis$ $n o$*r$ Fac$%$t 4 Ic$Fac$s p 6(List$n$rs p$rsona%isés p 7'

Ric)Fac$s con0i/*ration p 7+

Mét)od$ création composant p$rsonna%isé p 8

'www.objis.com - Formation JSF


3/89



RAPPELS J2EE

rc)it$ct*r$ m*%tico*c)$

rc)it$ct*r$ &'EE

Lirab%$s &'EE

#$ric$s &'EE

Ro%$s &'EE

"onc$pts t$c)ni3*$s c%és

(www.objis.com - Formation JSF


4/89

Rappel J2EE :Architecture multicouche

5


5/89

Rappel J2EE :Architecture J2EE

6


6/89

Livraisons J2EE

7


7/89

Services J2EE

&N9I : &aa Namin/ 9ir$ctor, Int$r0ac$

&" : &aa "onn$ctor rc)it$ct*r$

&T : &aa Transaction PI

&P : &aa P$rsist$nc$ PI

&M# : &aa M$ssa/$ #$ric$

&# : &aa *t)$ntication *t)orisation #$ric$

&;-


8/89



Concepts techniques cls

Inj$ction d$ dép$ndanc$s

Pro/rammation !ri$nté$ sp$cts 4 Int$rc$ption

nnotations

Mappin/ !bj$t 4 R$%ationn$%

#éc*rité

Transaction

www.objis.com - Formation JSF


9/89



Positionnement et architecture JSF

"ont$2t$ création F

?$rsions $t Imp%ém$ntations

F dans &'EE

F $t %$ patt$rn M?"

",c%$ d$ i$ r$3*@t$ F

Paca/$s $t composants F

"omposants additionn$%s : Ric)Fac$s 4 Ic$Fac$s+www.objis.com - Formation JSF


10/89



Conte!te "veloppement

"#applications Java$J2ee en 2%%&

JSP ' Servlets

Forc$: bi$n maAtrisé dé$%opp$*rs

Faib%$ss$: maint$nanc$ B

Struts

Forc$: Fram$wor w$b M?"'Faib%$ss$: création int$r0ac$

Faib%$ss$: p$* dCo*ti%s R9

S(in) :

Forc$: "omposants /rap)i3*$sForc$: !*ti%s R9

Faib%$ss$: pas dCé3*ia%$nt w$b B

=$soin 0ram$wor w$b M?" R918www.objis.com - Formation JSF


11/89



*aissance "e JSF

+esoin ,rame(or- et outils (e. RA/

D"omposantsC is*$%s

G$stion état écran

G$stion én$m$nts c%i$nt

M*%ti%in/*$?a%idation $ntré$ *ti%isat$*r

00ic)a/$ adapté pdaportab%$H

cc$ssibi%ité

Nai/ation $ntr$ pa/$Acteurs : I=M #UN =E !R"LE

Mars 2%%0 : spéci0ications F 1.8

Mai 2%%0 : spéci0ications F 1.111www.objis.com - Formation JSF

"rai/ Mac "%ana)an

Ed =*rns

m, Fow%$r


12/89



1ersions JSF et API J2EE

JSF && mai '885

R 1'> : )ttp:44jcp.or/4$n4jsr4d$tai%JidK1'>

s$r%$t '.( P 1.' &aa 1.(

JSF &2 aot '887R '6' : )ttp:44jcp.or/4$n4jsr4d$tai%JidK'6'

#$r%$t '.6 P '.1 &aa 6

JSF 2% j*i%%$t '88+R (15 : )ttp:44jcp.or/4$n4jsr4d$tai%JidK(15

#$r%$t '.6 P '.1 &aa 6

Pro0i% w$b &EE7

1'www.objis.com - Formation JSF


13/89



Implmentations "e JSF

Mo3arra : implmentation "e r,rence 4S5*6

Librairi$s : js0-api.jar js0-imp%.jar

"omposants nati0s : cor$ )tm%

M7Faces : implmentation Apache

Librairi$s : m,0ac$s-api m,0ac$s-imp%

"omposants : Tomaaw Toba/o Trinidad

*om.reuses autres

9étai% $t comparaison : www.js0matri2.n$t

1(www.objis.com - Formation JSF


14/89



Architecture 8 positionnement JSF

15www.objis.com - Formation JSF


15/89



Architecture 8 positionnement JSF



16/89



JSF "ans application J2EE



17/89



JSF et le mo"9le M1C

1>www.objis.com - Formation JSF


18/89



E!emple



19/89



Caractristiques JSF

9é$%opp$m$nt én$m$nti$% ori$nté "omposant

#imp%i0i$ accs $t /$stion donné$s méti$rs

*tomatis$ simp%i0i$ /$stion état écran $ntr$

p%*si$*rs r$3*@t$s

Mis$ $n o$*r$ d$ patt$rns conn*s

Mas3*$ bas ni$a* ttp#$r%$tR$3*$st4R$spons$

M$i%%$*r$ maint$nanc$

1+www.objis.com - Formation JSF


20/89



Mo"9le v9nementiel JSF

En$m$nts %iés a*2 DactionsC *ti%isat$*rs pp*i bo*tton c%ic s*r %i$n ),p$rt$2t$H.

To*t composant imp%ém$ntant Dction#o*rc$C

En$m$nts %iés O M& int$r0ac$ par %C*ti%isat$*r

Modi0ication donné$s c)amp t$2t$ combo

To*t composant imp%ém$ntant DEditab%$?a%*$o%d$rC

En$m$nts %iés a*2 donné$s d* mod%$ méti$r

L$s %ist$n$rs trait$nt %$s én$m$nts

'8www.objis.com - Formation JSF


21/89



C7cle "e requtes JSF



22/89



C7cle "e vie requte JSF :

; tapes cls or"onnes

&6 Restauration vue 4Ar.re composants ecran6

26 Appliquer param9tres requte


23/89



Pac-a)es $ Java"oc JSF

'(www.objis.com - Formation JSF

F 1.1

F 1.'

F '.8


24/89



Composants JSF


"omport$m$nt

"omposant

C t JSF " BML


25/89



Composants JSF ren"u BML

"isponi.le avec Mo3arra


'6 composants : pas ass$Q d$ c)oi2 B

E l C t


26/89



E!emples Composants :

rita)e et comportement spci,ique


P - $ J " JSF


27/89



Pac-a)es $ Java"oc JSF :

Le conte!te FacesConte!t


F 1.'

C t JSF


28/89



Composants JSF

supplmentaires

RichFaces 4J.oss6 : (((3.ossor)$rich,aces

Fusion pro3ets J.oss RichFaces et A3a!03s,

Le "veloppeur choisit les Dones "e la pa)e =

traiter cot serveur ' Dones = mettre = 3our

' "e &%% composants 5I avec support A3a!tests avec "i,,rents navi)ateurs

Chaque composant : ' "e


29/89



Rappels A3a!

'+www.objis.com - Formation JSF


30/89



JSF et A3a! avec RichFaces

A3a!03s, : n "e la volont "e crer applications

riches $ A3a! avec JSF

A3a!03s, : ,iltre qui a3oute "es ,onctions

3avascript ainsi que les "pen"ances "e l#o.3et

mlttpRequest au! composants JSF

Suite = requete BBP? le moteur A3a! trans,orme

la requte et l#envoi au ,iltre A3a!03s,

Le ,iltre A3a!03s, convertit les "onnes au ,ormat

ML et trans,9re la requte = la servlet

FacesServlet? pour raliser c7cle ; tapes JSF

(8www.objis.com - Formation JSF


31/89



JSF et A3a! avec RichFaces


Composants JSF


32/89



Composants JSF

supplmentaires

IceFaces 4IceSo,t6 : (((ice,acesor)

Lea"er historique sur JSF ' A3a!$Ge.2

Bechnolo)ies S-innin)? Multime"ia? AJA Push

Int)ration avec

•

JSF &! $ JSF &2 $ Facelet• Sprin) Ge. Flo(

• J.oss Seam

• M7Faces Bomaha(-

• Portails : Li,era7? J.oss Portal? Ge.Lo Portal

• I/E : Eclipse? M7Eclipse? *et.eans

Communaut : &%%%%% "veloppeurs'

('www.objis.com - Formation JSF

http://www.icefaces.org/http://www.icefaces.org/


33/89



JSF et A3a! avec IceFaces

((www.objis.com - Formation JSF


34/89



Li.rairies Ice,aces

/pen"ences ice,aces &H&



35/89



IceFaces : plu)in Eclipse

Int)ration "u plu)in "ans Eclipse

• Manuelle si version plu)in


36/89

IceFaces : Plu)in Eclipse

(7

P%*/in IceFaces 4"Dipper archive ' install eclipse local6

P%*/in J.ossBools pour int)ration J.oss 4"Dipper le Dip "ans rpertoire eclips

P%*/in m2eclipse 4Maven6

IceFaces :


37/89

www.objis.com - INTEGRTI!N "!NTINUEwww.ob is.com - Formation #PRING

IceFaces :

in"ustrialiser "veloppements

AppFuse : squelettes pro3ets 4archet7pes maven6

• (((app,useor)

• Initi en 2%%2 par Mar- Rai.le

• Squelettes appli Struts$Js, ' hi.ernate$sprin)

•

Aucun squelette avec Ice,aces en ,rontal

E"oras :

• (((e"oras,rame(or-or)

• Initi par MIMACOM? qui ,ournit supportIceFaces en Europe 4mimacomch6

IceFusion AppFuse pour IceFaces

• ice,usion)oo)leco"ecom (>

http://www.appfuse.org/http://www.edorasframework.org/http://www.edorasframework.org/http://www.appfuse.org/


38/89


/veloppement IceFaces


/mo JSF :


39/89


/mo JSF :Cinmatique application

(+www.objis.com - Formation JSF

ind$2.jsp Main.jsp

"on0irm.jsp

R$/ist$r.jsp 9on$.jsp

Con,i)uration JSF :


40/89


Con,i)uration JSF :,ichier (e.!ml


1

'

E h N t il JSF


41/89


EnchaNnement accueil cran JSF


1

'

(

5

6

8

Con,i)uration JSF :


42/89


Co )u at o JS,acescon,i)!ml


1 '

(


43/89


Int)ration JSP $ JSF

O.3ecti,s "i,,rents

P : )tm% jaa 4 trait$m$nt Dd$ )a*t $n basC F : composants 4 trait$m$nt én$m$nti$%

C7cle "e vie "i,,rent

P &aa )tm%

F : c,c%$ d$ r$3*@t$ précis 7 étap$s

Etapes )estion composant JSF

création /$stion $ntré$ r$nd*

Etapes composant JSF "ans JSP En parra%%%$ : création r$nd*

A3out "e conenu "ans la pa)e par JSF 8 JSP

En para%%%$ : création r$nd* B5(www.objis.com - Formation JSF

Int)ration JSP $ JSF :


44/89



E!emple "e pro.l9me




45/89



Compren"re la technolo)ie Facelet


Bechnolo)ie "e 1ue a"apte = JSF ?i$wand%$r

S#ins9re .ien "ans le c7cle requte JSF

http:$$,acelets"ev3avanet


http://facelets.dev.java.net/http://facelets.dev.java.net/


46/89



Compren"re la technolo)ie Facelet


C ,


47/89


Facelet : Con,i)uration


1

(

'


48/89


Facelet : template!html


Facelet :


49/89


Facelet :

E!emple ecran & 4)uess!html6

5+www.objis.com - Formation JSF

1

'

5

(

Facelet :


50/89


Facelet :

ren"u ecran & 4)uess!html6


(

5

Facelet :


51/89


Facelet :

E!emple ecran 2 4response!html6


1

'

5

(

P$rm$t co%%aboration dé$%opp$*r 4 w$bd$si/n$r

Facelet :


52/89


Facelet :

ren"u ecran 2 4response!html6


/ F l t I F


53/89

/mo Facelet avec IceFaces :Bemplate v& 4merci Eclipse 6

6(

/ F l t I F


54/89

/mo Facelet avec IceFaces :Bemplate v2

65

/ F l t I F


55/89

/mo Facelet avec IceFaces :Bemplate v<

66

/mo Facelet avec IceFaces :


56/89

/mo Facelet avec IceFaces :Bemplate v0

67



57/89

/mo Facelet avec IceFaces :Pa)e v%

6>



58/89

/mo Facelet avec IceFaces :Pa)e v&

6



59/89

/mo Facelet avec IceFaces :Pa)e v& ren"u

6+



60/89

/mo Facelet avec IceFaces :Pa)e v2

78



61/89

/mo Facelet avec IceFaces :Pa)e v2 ren"u

71

Cration listener personnalis


62/89


Cration listener personnalis


Po*r éco*t$r $t trait$r ( t,p$s dCén$m$nts

T,p$ 1 : actions *ti%isat$*r

ction $$nt déc%$nc)é par bo*ton o* %i$n

T,p$ ' : c)an/$m$nt d$ a%$*r c)amp

inp*tT$2t

T,p$ ( : p)as$s F

Un$ d$s 7 p)as$s trait$m$nt r$3*@t$.

ccs par pro/rammation O %Cén$m$nt ctionE$nt o* a*cont$2t$ F Fac$s"ont$2t

Compren"re un ActionEvent


63/89


Compren"re un ActionEvent

7(www.objis.com - Formation JSF

Cration listener


64/89


t7pe & : action utilisateur


1

'

Cration listener


65/89


t7pe 2 : chan)ement valeur champ


1

'

Cration listener


66/89


t7pe < : phases JSF


1

'

Cration listener


67/89


t7pe < : e!emple lo)s phases JSF


JSF et A3a!


68/89


JSF et A3a!

A3a!03s, )9re ar.re "e composants tout au lon)

"e la requte $ rponse A3a!


RichFaces


69/89


RichFaces

+i.lioth9que composants )raphiques JSF

+as sur A3a!03s, 4' a3out s-ins ' composants6 a03: et rich:

' "e &%% composants visuels

"emos : 3.ossor)$rich,aces$"emoshtml

JSF &2 $ RichFace


70/89


a03:support

P$rm$t dCajo*t$r %$ s*pport dCaja2 a*2 composants F d$ bas$

ttrib*t DeventC : én$m$nt jaascript 3*i %anc$ %a r$3*@t$ aja2

ttrib*t DreRen"er C : conti$nt %$s ids d$s composants O m$ttr$ O

jo*r %ors d* r$to*r d$ %a répons$

ttrib*t DactionListener C : bindin/ d$ %a mét)od$ 3*i pr$nd *n ctionE$nt $n paramtr$ $t r$to*rn$ *n t,p$ oid.

ttrib*t DactionC : bindin/ d$ %a mét)od$ 3*i ino3*$ %Caction d$

%Capp%ication>8www.objis.com - Formation JSF

Attri.uts commun A0J $ RichFaces


71/89


Attri.uts commun A0J $ RichFaces

r$R$nd$r

aja2#in/%$ : boo%é$n po*r %imit$r %$s p)as$s '(5 s$*%$m$nt a*composant 3*i $noi$ %a r$3*@t$

Imm$diat$ : comm$ $n js0 po*r éit$r p)as$

a%idation4con$rsion

b,passUpdat$s : p$rm$t dCéit$r p)as$s M& mod%$

inocation app%ication po*r pass$r dir$ct$m$nt O p)as$ r$nd*

répons$.

on"omp%$t$ : cod$ O $2éc*t$r coté c%i$nt O %a 0in d$ %a r$3*@t$

%imitTo%ist : si a%$*r $st tr*$ %a mis$ O jo*r d$s composants coté

c%i$nts s$ %imit$ O %a %ist$ dans %Cattrib*t r$R$nd$r tim$!*t : Ma2 d*ré$ r$3*@t$ aja2

9ata : p$rm$t d$ réc*pér$r d* s$r$*r *n$ donné$ d*rant %a

r$3*@t$ aja2. E2 : propriété dC*n b$an a$c EL séria%isé$ ia

!N

>1www.objis.com - Formation JSF

Int)ration JSF $ RichFaces


72/89



>'www.objis.com - Formation JSF

1

'

(

Optionnel : int)ration avec Facelets

Fi%tr$ Ric)Fac$s



73/89



>(www.objis.com - Formation JSF

Int)ration Facelet $ RichFaces


74/89






75/89




Mo"i,ication S-ins


76/89


Mo"i,ication S-ins


#ins par dé0a*t dans MET-INF4sins d$ %Carc)i$ Ric)Fac$s-

imp%-222.jarb%*$#, La/*na c%assic /%ass-2H

Po*r p$rsonna%is$r sin

désarc)i$r ric)0ac$s-imp%-222.jar #*r *n 0ic)i$r .prop$rti$s 0air$ modi0 css désiré$s

rc)i$r O no*$a* %$ jar $t m$ttr$ ds proj$t


77/89


C p

>>www.objis.com - Formation JSF

Concept *& : envoi "une requte A3a!

– Sa5j:commandLinSa5j:command=*tton – Sa5j:s*pport

– Sa5j:po%%

– ttrib*t %imitToList

Concept *2 : mise = 3our partielle "e la pa)e

– ttrib*t r$R$nd$r

– Sa5j:o*tp*tPan$%

Concept *< : Dones = traiter cot serveur – Sa5j:r$/ion

– ttrib*t ja2#in/%$

– ttrib*t proc$ss

Composants cls RichFaces


78/89


p

>

Composants "entre – Sric):inp%ac$Inp*t Sric):inp%ac$#$%$ct

– Sric):s*//$stion=o2 Sric):combo=o2...

Composants "e sortie – Sric):pan$%Sric):simp%$To//%$pan$%

– Sric):tabPan$%Sric):moda%Pan$%Sric):Pan$%=ar

Composants "itration "e "onnes – Sric):dataTab%$ Sric):dataListSric):dataGrid

– Sric):data#cro%%$r Pa/ination

Composants "e slection – Sric):picList Sric):ord$rin/List

Composants "e Menu – Sric):drop9ownM$n* Sric):cont$2tM$n*

/onnes et ar.res scrolla.les – Sric):scro%%ab%$9ataTab%$ Sric):tr$$

Concept *& : envoi requte A3a!


79/89


p q 3

>+www.objis.com - Formation JSF

Cration composant personnalis


80/89




1 "ré$r c%ass$ )érit$ d$ 3ava!,acescomponent5IComponent+aseR$dé0inir ma mét)od$ $ncod$=$/inFac$"ont$2t cont$2t

#i attrib*t a%ors r$dé0inir $ncod$End

' Enr$/istr$r %a c%ass$ dans ,acescon,i)!ml

ba%is$ component

( Crer un Ba) spéci0i3*$ c%ass$ )éritant d$ UI"ompon$ntTa/

E2 : s0:s$%%$r$%%o

5 Crer le "escripteur 4BL/6 "u Ba)

E2$mp%$ : )ttp:44www.t)$s$r$rsid$.com4n$ws41(75>74=*i%din/-"*stom-F-UI-"ompon$nts

Composant personnalis :

C

" i t


81/89


Compren"re son environnement



C

" l lli it ti


82/89


Compren"re les sollicitations

'www.objis.com - Formation JSF

Mét)od$s O /ér$r :

Proc$ss9$cod$s

Proc$ss?a%idators

Proc$ssUpdat$s

Proc$sspp%ication

R$nd$rR$spons$

Lnacé$s par UI?i$wRoot

O di00$r$nt$s p)as$s d* c,c%$ d$ i$


C

" 5I1i R t


83/89


Compren"re 5I1ie(Root


Impact = chaque phase


84/89


Impact = chaque phase


P)as$ 1 R$sta*ration d$ %a *$

G$stion d$ %état coté c%i$nt o* s$r$*r : sa*$r 4 r$sta*r$r

optionn$% Imp%ém$nt$r jaa2.0ac$s.compon$nt.#tat$o%d$r

• E2 : sa$#tat$ r$to*rn$ tab%$a* dobj$ts #éria%isab%$s

• E2 : r$stor$#tat$ att$nd *n tab%$a* dobj$ts #éria%isab%$s

P)as$ ' Trait$m$nt d$ %a r$3*@t$

9écod$r $2p%oit$r $n int$rn$ %$s paramtr$s d$ r$3*@t$

• L$ 0air$ dans composant !U dé%é/*$r O c%ass$ R$nd$r$r

Imp*%sion par mét)od$ proc$ss9$cod$ d* UI?i$wRoot ob%i/atoir$ Imp%ém$t$r mét)od$ d$cod$

9$cod$ traai%%$r a$c %$ R$nd$r$r

( Crer un



85/89


C at o co posa t pe so a s


1 "ré$r c%ass$ )érit$ d$ 3ava!,acescomponent5IComponent+ase

R$dé0inir ma mét)od$ $ncod$=$/inFac$"ont$2t cont$2t

#i attrib*t a%ors r$dé0inir $ncod$End

' Enr$/istr$r %a c%ass$ dans ,acescon,i)!ml

ba%is$ component

( Crer un Ba) spéci0i3*$ c%ass$ )éritant d$ UI"ompon$ntTa/

E2 : s0:s$%%$r$%%o

5 Crer le "escripteur 4BL/6 "u Ba)

E2$mp%$ : )ttp:44www.t)$s$r$rsid$.com4n$ws41(75>74=*i%din/-"*stom-F-UI-"ompon$nts


R " i l

4R " 6


86/89


Ren"u visuel 4Ren"er6



" "

46 " t


87/89


"eco"e46 "ans composant

>www.objis.com - Formation JSF


"eco"

e46 "ans Ren"erer perso


88/89


"eco"e46 "ans Ren"erer perso



enco"e+

e)in46


89/89

enco"e+e)in46

Documents

Formation JSP Java Server Faces