Primefaces User Guide 5 0

USER GUIDE
5.0
Author
aatay ivici
First Edition
PrimeFaces Users Guide
Table of Contents
About the Author..................................................................................................................................9
1. Introduction....................................................................................................................................10
1.1 What i !ri"e#ace$.............................................................................................................10
%. Setu&...............................................................................................................................................11
%.1 Do'n(oad...............................................................................................................................11
%.% De&endencie.........................................................................................................................1%
%.) *on+i,uration.........................................................................................................................1)
%.- .e((o Wor(d...........................................................................................................................1)
). *o"&onent Suite............................................................................................................................1-
).1 Accordion!ane(......................................................................................................................1-
).% A/a01ehavior.........................................................................................................................12
).) A/a0E0ce&tion.and(er..........................................................................................................%0
).- A/a0Statu..............................................................................................................................%1
).- Auto*o"&(ete........................................................................................................................%-
).5 1(oc3UI.................................................................................................................................)-
).4 1read*ru"b..........................................................................................................................)5
).5 1utton....................................................................................................................................)9
).2 *ache.....................................................................................................................................-%
).9 *a(endar.................................................................................................................................--
).10 *a&tcha................................................................................................................................5-
).11 *aroue(...............................................................................................................................55
).1% *e((Editor............................................................................................................................4)
).1) *hart....................................................................................................................................4-
).1).1 !ie*hart.......................................................................................................................45
).1).% 6ine*hart.....................................................................................................................45
).1).) 1ar*hart.......................................................................................................................50
).1).- Donut*hart..................................................................................................................5%
).1).5 1ubb(e*hart.................................................................................................................5-
).1).4 7h(c *hart....................................................................................................................54
).1).5 8eterGau,e *hart.......................................................................................................52
).1).2 *o"bined *hart...........................................................................................................20
).1).9 8u(ti&(e A0i...............................................................................................................21
).1).10 Date A0i...................................................................................................................2)
).1).11 Interactive *hart........................................................................................................2-
).1).1% E0&ort........................................................................................................................25
).1).1) Static I"a,e..............................................................................................................24
).1).1- S3innin,.....................................................................................................................25
).1).15 E0tender.....................................................................................................................22
).1).14 *hart A!I...................................................................................................................29
).1- *(oc3....................................................................................................................................9-
).15 *o((ector..............................................................................................................................94
).14 *o(or !ic3er.........................................................................................................................95
2
).15 *o(u"n..............................................................................................................................100
).12 *o(u"n.............................................................................................................................10%
).19 *o(u"nGrou&....................................................................................................................10-
).%0 *o""and1utton................................................................................................................105
).%1 *o""and6in3...................................................................................................................110
).%% *on+ir"..............................................................................................................................11-
).%% *on+ir"Dia(o,...................................................................................................................115
).%) *ontent#(o'......................................................................................................................112
).%- *onte0t8enu.....................................................................................................................1%0
).%5 Dahboard..........................................................................................................................1%)
).%4 DataE0&orter......................................................................................................................1%2
).%5 DataGrid............................................................................................................................1)1
).%2 Data6it.............................................................................................................................1)5
).%9 DataScro((er.......................................................................................................................1-1
).)0 Data9ab(e...........................................................................................................................1-5
).)1 De+au(t*o""and..............................................................................................................150
).)% Dia(o,................................................................................................................................15%
).)) Dra,:Dro&........................................................................................................................155
).)).1 Dra,,ab(e...................................................................................................................155
).)).% Dro&&ab(e..................................................................................................................121
).)- Doc3..................................................................................................................................124
).)5 Editor.................................................................................................................................122
).)4 E++ect.................................................................................................................................19%
).)5 #eedReader........................................................................................................................195
).)2 #ie(det..............................................................................................................................194
).)9 #i(eDo'n(oad....................................................................................................................199
).-0 #i(eU&(oad.........................................................................................................................%01
).-1 #ocu..................................................................................................................................%02
).-% #ra,"ent............................................................................................................................%10
).-) Ga((eria..............................................................................................................................%1%
).-- G8a&.................................................................................................................................%15
).-5 G8a&In+oWindo'.............................................................................................................%%4
).-4 Gra&hicI"a,e....................................................................................................................%%5
).-5 Gro'(.................................................................................................................................%)1
).-2 .ot;ey..............................................................................................................................%)5
).-9 Id(e8onitor........................................................................................................................%)2
).50 I"a,e*o"&are..................................................................................................................%-0
).51 I"a,e*ro&&er....................................................................................................................%-%
).5% I"a,eS'itch......................................................................................................................%-4
).5) In&(ace...............................................................................................................................%-9
).5- In&ut8a3..........................................................................................................................%5)
).55 In&ut9e0t............................................................................................................................%55
).54 In&ut9e0tarea.....................................................................................................................%40
3
).55 ;eyboard...........................................................................................................................%45
).52 6ayout................................................................................................................................%50
).59 6ayoutUnit.........................................................................................................................%55
).40 6i,ht1o0............................................................................................................................%55
).41 6in3....................................................................................................................................%20
).4% 6o,.....................................................................................................................................%2)
).4) 8edia.................................................................................................................................%25
).4- 8e,a8enu.........................................................................................................................%25
).45 8enu..................................................................................................................................%90
).44 8enubar.............................................................................................................................%94
).45 8enu1utton.......................................................................................................................%99
).42 8enuIte"..........................................................................................................................)01
).49 8ea,e.............................................................................................................................)0-
).50 8ea,e............................................................................................................................)04
).51 8ind"a&............................................................................................................................)09
).5% 8u(tiSe(ect6itbo0............................................................................................................)1%
).5) <oti+ication1ar..................................................................................................................)15
).5- 7rder6it............................................................................................................................)15
).55 7ut&ut6abe(.......................................................................................................................)%1
).54 7ut&ut!ane(.......................................................................................................................)%-
).55 7ver(ay!ane(.....................................................................................................................)%4
).52 !ane(..................................................................................................................................)%9
).59 !ane(Grid...........................................................................................................................))%
).20 !ane(8enu.........................................................................................................................))5
).21 !a'ord............................................................................................................................))5
).2% !hoto*a"..........................................................................................................................)-%
).2) !ic36it..............................................................................................................................)--
).2- !o((.....................................................................................................................................)50
).25 !rinter................................................................................................................................)5)
).24 !ro,re1ar........................................................................................................................)5-
).25 Radio1utton.......................................................................................................................)52
).22 Ratin,................................................................................................................................)59
).29 Re"ote*o""and..............................................................................................................)4)
).90 ReetIn&ut..........................................................................................................................)45
).91 Rei=ab(e............................................................................................................................)45
).9% Rin,...................................................................................................................................)51
).9) Ro'....................................................................................................................................)5-
).9- Ro'Editor..........................................................................................................................)55
).95 Ro'E0&anion...................................................................................................................)54
).94 Ro'9o,,(er.......................................................................................................................)55
).95 Schedu(e............................................................................................................................)52
).92 Scro((!ane(.........................................................................................................................)25
).99 Se(ect1oo(ean1utton.........................................................................................................)29
4
).100 Se(ect1oo(ean*hec3bo0..................................................................................................)91
).101 Se(ect*hec3bo08enu......................................................................................................)9)
).10% Se(ect8any1utton...........................................................................................................)95
).10) Se(ect8any*hec3bo0......................................................................................................)99
).10- Se(ect8any8enu.............................................................................................................-01
).105 Se(ect7ne1utton..............................................................................................................-05
).104 Se(ect7ne6itbo0............................................................................................................-05
).105 Se(ect7ne8enu...............................................................................................................-11
).102 Se(ect7neRadio...............................................................................................................-14
).109 Se&arator..........................................................................................................................-19
).110 S(ide8enu........................................................................................................................-%1
).111 S(ider................................................................................................................................-%-
).11% S&ot(i,ht...........................................................................................................................-%9
).11- Soc3et..............................................................................................................................-)1
).115 S&acer..............................................................................................................................-))
).114 S&inner.............................................................................................................................-)-
).115 S&(it1utton.......................................................................................................................-)9
).112 Sub"enu..........................................................................................................................--)
).119 Stac3................................................................................................................................---
).1%0 Stic3y...............................................................................................................................--4
).1%1 Sub9ab(e..........................................................................................................................--2
).1%% Su""aryRo'..................................................................................................................--9
).1%) 9ab...................................................................................................................................-50
).1%- 9ab8enu..........................................................................................................................-51
).1%5 9ab>ie'...........................................................................................................................-5)
).1%4 9a,*(oud.........................................................................................................................-52
).1%5 9er"ina(...........................................................................................................................-41
).1%2 9he"eS'itcher................................................................................................................-4%
).1%9 9iered8enu......................................................................................................................-45
).1)0 9oo(bar.............................................................................................................................-42
).1)1 9oo(barGrou& ?De&recated@.............................................................................................-50
).1)% 9oo(ti&..............................................................................................................................-51
).1)) 9ree..................................................................................................................................-5-
).1)- 9ree<ode.........................................................................................................................-25
).1)5 9ree9ab(e.........................................................................................................................-24
).1)4 Water"ar3.......................................................................................................................-90
).1)5 Wi=ard..............................................................................................................................-9%
-. !artia( Renderin, and !rocein,.................................................................................................-92
-.1 !artia( Renderin,.................................................................................................................-92
-.1.1 In+ratructure................................................................................................................-92
-.1.% Uin, ID.....................................................................................................................-92
-.1.) <oti+yin, Uer............................................................................................................500
-.1.- 1it:!iece..................................................................................................................500
5
-.% !artia( !rocein,................................................................................................................501
-.%.1 !artia( >a(idation..........................................................................................................501
-.%.% Uin, Id......................................................................................................................50%
-.) Search E0&reion #ra"e'or3............................................................................................50)
-.).1 ;ey'ord.....................................................................................................................50)
-.).% !ri"e#ace Se(ector ?!#S@.........................................................................................50-
-.- !artia(Sub"it.......................................................................................................................504
5. Aavacri&t A!I...............................................................................................................................505
5.1 !ri"e#ace <a"e&ace.......................................................................................................505
5.% A/a0 A!I..............................................................................................................................502
4. Dia(o, #ra"e'or3........................................................................................................................510
5. *(ient Side >a(idation...................................................................................................................51-
5.1 *on+i,uration.......................................................................................................................51-
5.% A/a0 v <onBA/a0................................................................................................................51-
5.) Event..................................................................................................................................515
5.- 8ea,e..............................................................................................................................515
5.5 1ean >a(idation...................................................................................................................514
5.4 E0tendin, *S>....................................................................................................................514
2. 9he"e..........................................................................................................................................5%1
2.1 A&&(yin, a 9he"e...............................................................................................................5%%
2.% *reatin, a <e' 9he"e........................................................................................................5%)
2.) .o' 9he"e Wor3..............................................................................................................5%-
2.- 9he"in, 9i&.......................................................................................................................5%5
9. !ri"e#ace !uh...........................................................................................................................5%4
9.1 Setu&....................................................................................................................................5%4
9.% Annotation..........................................................................................................................5%5
9.) A!I.......................................................................................................................................5%9
9.- Soc3et *o"&onent...............................................................................................................5%9
9.5 !uttin, It A(( 9o,ether.........................................................................................................5)0
9.5.1 *ounter........................................................................................................................5)0
9.5.% #ace8ea,e..............................................................................................................5)%
9.4 9i& and 9ric3....................................................................................................................5)-
10. !ri"e#ace 8obi(e.....................................................................................................................5)5
10.1 Setu&..................................................................................................................................5)5
10.% !a,e..................................................................................................................................5)4
10.% <avi,ation........................................................................................................................5)5
10.) *o"&onent.......................................................................................................................5)2
10.).1 *ontent.......................................................................................................................5)2
10.).% #ie(d...........................................................................................................................5)9
10.).) #ooter.........................................................................................................................5-0
10.).- .eader........................................................................................................................5-1
10.).5 In&utS(ider.................................................................................................................5-%
10.).4 !a,e............................................................................................................................5--
6
10.).5 Ran,eS(ider................................................................................................................5-5
10.).2 S'itch........................................................................................................................5-4
10.- Render;it..........................................................................................................................5-2
10.-.1 Accordion!ane(..........................................................................................................5-2
10.-.% Auto*o"&(ete............................................................................................................5-2
10.-.) 1utton........................................................................................................................5-2
10.-.- *a(endar.....................................................................................................................5-9
10.-.5 Data6it......................................................................................................................5-9
10.-.4 Dia(o,........................................................................................................................5-9
10.-.5 #i(eU&(oad.................................................................................................................5-9
10.-.2 Gro'(.........................................................................................................................550
10.-.9 In&ut9e0t....................................................................................................................550
10.-.10 In&ut9e0tarea...........................................................................................................550
10.-.11 6in3..........................................................................................................................550
10.-.1% 8enu........................................................................................................................550
10.-.1) !ane(........................................................................................................................550
10.-.1- !ane(Grid.................................................................................................................551
10.-.15 Se(ect1oo(ean*hec3bo0..........................................................................................551
10.-.14 Se(ect*hec3bo08enu..............................................................................................551
10.-.15 Se(ect8any1utton...................................................................................................551
10.-.12 Se(ect8any*hec3bo0..............................................................................................551
10.-.19 Se(ect7ne1utton......................................................................................................551
10.-.%0 Se(ect7ne8enu........................................................................................................551
10.-.%1 Se(ect7neRadio.......................................................................................................551
10.-.%% 9ab8enu..................................................................................................................551
10.-.%- 9ab>ie'...................................................................................................................55%
10.-.%5 9oo(bar.....................................................................................................................55%
10.5 9he"e..............................................................................................................................55)
10.4 #ra"e'or3.........................................................................................................................55-
10.4.1 A/a0 U&date..............................................................................................................55-
10.4.% !a 9hrou,h E(e"ent..............................................................................................55-
10.4.) 6a=y !a,e.................................................................................................................555
10.4.- 9ouch Event..............................................................................................................555
11. Uti(itie.......................................................................................................................................555
11.1 ReCuet*onte0t..................................................................................................................555
11.% E6 #unction......................................................................................................................540
11.) E0ce&tion .and(er.............................................................................................................541
11.- 1ean>a(idation 9ran+or"ation.........................................................................................54)
11.5 !ri"e#ace 6oca(e...........................................................................................................54-
1%. !ort(et........................................................................................................................................545
1). Ri,htB9oB6e+t..............................................................................................................................542
1-. IDE Su&&ort................................................................................................................................549
1-.1 <et1ean............................................................................................................................549
1-.% Ec(i&e...............................................................................................................................550
7
15. !ro/ect Reource.......................................................................................................................551
14. #AD............................................................................................................................................55%
8
About the Author
aatay ivici i a "e"ber o+ AavaServer #ace E0&ert Grou&E the +ounder o+ !ri"e#ace and
!8* "e"ber o+ o&en ource AS# i"&(e"entation A&ache 8y#ace. .e i a reco,ni=ed &ea3er in
internationa( con+erence inc(udin, Aava7neE S&rin,7neE Aa=oonE AAFE WBAAFE AS#Su""itE
AS#DayE *onB#e and "any (oca( event uch a AUG.
aatay i a(o an author and technica( revie'er o+ a cou&(e boo3 re,ardin, 'eb a&&(ication
deve(o&"ent 'ith Aava and AS#. A an e0&erienced trainerE he ha trained over )00 deve(o&er on
Aava EE techno(o,ie "ain(y AS#E S&rin,E EA1 ).0 and A!A.
aatay i a(o 3no'n a 7&ti"u !ri"e in AavaServer #ace *o""unity.
9
1. Introduction
1.1 What is PrimeFaces?
!ri"e#ace i an o&en ource AS# co"&onent uite 'ith variou e0tenion.
G Rich et o+ co"&onent ?.t"(EditorE Dia(o,E Auto*o"&(eteE *hart and "any "ore@.
G 1ui(tBin A/a0 baed on tandard AS# %.0 A/a0 A!I.
G 6i,ht'ei,htE one /arE =eroBcon+i,uration and no reCuired de&endencie.
G !uh u&&ort via At"o&here #ra"e'or3.
G 8obi(e UI 3it to create "obi(e 'eb a&&(ication.
G S3innin, #ra"e'or3 'ith )5H bui(tBin the"e and u&&ort +or viua( the"e dei,ner too(.
G E0tenive docu"entation.
G 6ar,eE vibrant and active uer co""unity.
G Deve(o&ed 'ith I&aionI +ro" a&&(ication deve(o&er to a&&(ication deve(o&er.
10
2. Setup
2.1 Download
!ri"e#ace ha a in,(e /ar ca((ed primefaces-{version}.jar. 9here are t'o 'ay to do'n(oad thi
/arE you can either do'n(oad +ro" !ri"e#ace ho"e&a,e or i+ you are a "aven uer you can de+ine
it a a de&endency.
Download Manually
9hree di++erent arti+act are avai(ab(e +or each !ri"e#ace verionE binaryE ource and bund(e.
1und(e contain binaryE ource and /avadoc.
http://www.primefaces.org/downloads
Download with Maen
Grou& id i org.primefaces and arti+act id i primefaces.
<dependency>
<groupId>org.primefaces</groupId>
<artifactId>primefaces</artifactId>
<version>5.0</version>
</dependency>
11
2.2 Dependencies
!ri"e#ace on(y reCuire a AA>A 5H runti"e and a AS# %.0 i"&(e"entation a "andatory
de&endencie. 9herere o"e o&tiona( (ibrarie +or certain +eature. 6icene o+ a(( de&endencie and
any )rd &art 'or3 incor&orated are co"&atib(e 'ith the !ri"e#ace 6icene.
Dependency Version * Type Description
AS# runti"e %.0E %.1 or %.% ReCuired A&ache 8y#ace or 7rac(e 8o/arra
ite0t %.1.5 7&tiona( DataE0&orter ?!D#@.
a&ache &oi ).5 7&tiona( DataE0&orter ?E0ce(@.
ro"e 1.0 7&tiona( #eedReader.
co""onB+i(eu&(oad 1.) 7&tiona( #i(eU&(oad
co""onBio %.% 7&tiona( #i(eU&(oad
at"o&here %.1.) 7&tiona( !ri"e#ace !uh
J 6ited verion are teted and 3no'n to be 'or3in, 'ith !ri"e#aceE other verion o+ thee
de&endencie "ay a(o 'or3 but not teted.
!SF "untime
!ri"e#ace 5.0 u&&ort AS# %.0E %.1 and %.% runti"e at the a"e ti"e uin, +eature detection and
by not havin, co"&i(e ti"e de&endency to a &eci+ic verion. A a reu(t o"e +eature are on(y
avai(ab(e de&endin, on the runti"e.
A ,ood e0a"&(e +or runti"e co"&atibi(ity i the &athrou,h attributeE a AS# %.% &eci+ic +eature to
di&(ay dyna"ic attribute. In +o((o'in, &a,eE &a throu,h attribute &(aceho(der on(y ,et rendered
i+ the runti"e i AS# %.%.
<!DO!"#$ html>
<html &mlns'(http://www.w)c.org/*+++/&html(
&mlns:h'(http://,ava.sun.com/,sf/html(
&mlns:p'(http://primefaces.org/ui(
&mlns:pt'(http://&mlns.,cp.org/,sf/passthrough(>
<h:head>
</h:head>
<h:-ody>
<p:input!e&t value'(./-ean.value0( pt:placeholder'(1atermar2 here(/>
</h:-ody>
</html>
12
2.# $on%i&uration
!ri"e#ace doe not reCuire any "andatory con+i,uration and +o((o' con+i,uration by e0ce&tion
&attern o+ Aava EE. .ere i the (it o+ a(( con+i,uration o&tion de+ined 'ith a conte0B&ara" uch aK
<conte&t3param>
<param3name>primefaces.!4$5$</param3name>
<param3value>-ootstrap</param3value>
</conte&t3param>
Name Default Description
9.E8E arito 9he"e o+ the a&&(ication.
"obi(e.9.E8E nu(( 9he"e o+ the "obi(e a&&(ication.
!US.LSER>ERLUR6 nu(( *uto" erver ur( +or !ri"e#ace !uh.
SU18I9 +u(( De+ine a/a0 ub"it "odeE full or partial.
DIR (tr De+ine orientationE ltr or rtl.
RESE9L>A6UES 0 When enab(edE a/a0 u&dated in&ut are reet +irt.
SE*RE9 &ri"e+ace Secret 3ey to encry&tBdecry&t va(ue e0&reion e0&oed
in renderin, Strea"ed*ontent.
*6IE<9LSIDEL>A6IDA9I7< 0 *ontro( c(ient ide va(idatation.
U!67ADER auto De+ine u&(oader "odeK autoE native or commons.
9RA<S#7R8L8E9ADA9A +a(e 9ran+or" bean va(idation "etadata to ht"( attribute.
2.' (ello World
7nce you have added the &ri"e+ace /ar to your c(a&athE you need to add the !ri"e#ace
na"e&ace to your &a,e to be,in uin, the co"&onent. .ere i a i"&(e &a,e (i3e tet.0ht"(K
<!DO!"#$ html>
<html &mlns'(http://www.w)c.org/*+++/&html(
&mlns:h'(http://&mlns.,cp.org/,sf/html(
&mlns:p'(http://primefaces.org/ui(>
<h:head></h:head>
<h:-ody>
<p:editor />
</h:-ody>
</html>
When you run thi &a,e throu,h #ace Serv(et "a&&in, e.,. J./+E you hou(d ee a rich te0t editor
'hen you run the &a,e 'ith tet./+.
13
#. $omponent Suite
#.1 AccordionPanel
Accordion!ane( i a container co"&onent that di&(ay content in tac3ed +or"at.

In%o
9a, accordionPanel
*o"&onent *(a org.primefaces.component.accordionpanel.Accordionpanel
*o"&onent 9y&e org.primefaces.component.AccordionPanel
*o"&onent #a"i(y org.primefaces.component
Renderer 9y&e org.primefaces.component.AccordionPanelenderer
Renderer *(a org.primefaces.component.accordionpanel.AccordionPanelenderer
Attributes
Name Default Type Description
id nu(( Strin, UniCue identi+ier o+ the co"&onent
rendered true boo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onent.
bindin, nu(( 7b/ect An E6 e0&reion that "a& to a erver ide
UI*o"&onent intance in a bac3in, bean.
activeInde0 +a(e Strin, Inde0 o+ the active tab or a co""a e&arated trin, o+
inde0e 'hen "u(ti&(e "ode i on.
14
ty(e nu(( Strin, In(ine ty(e o+ the container e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the container e(e"ent.
on9ab*han,e nu(( Strin, *(ient ide ca((bac3 to invo3e 'hen an inactive tab i
c(ic3ed.
on9abSho' nu(( Strin, *(ient ide ca((bac3 to invo3e 'hen a tab ,et activated.
dyna"ic +a(e 1oo(ean De+ine the to,,(e "ode.
cache true 1oo(ean De+ine i+ activatin, a dyna"ic tab hou(d (oad the
content +ro" erver a,ain.
va(ue nu(( 6it 6it to iterate to di&(ay dyna"ic nu"ber o+ tab.
var nu(( Strin, <a"e o+ iterator to ue in a dyna"ic nu"ber o+ tab.
"u(ti&(e +a(e 1oo(ean *ontro( "u(ti&(e e(ection.
dir (tr Strin, De+ine te0t directionE va(id va(ue are ltr and rtl.
&re&endId true 1oo(ean Accordion!ane( i a na"in, container thu &re&end it
id to it chi(dren by de+au(tE a +a(e va(ue turn thi
behavior o++ e0ce&t +or dyna"ic tab.
'id,et>ar nu(( Strin, <a"e o+ the c(ient ide 'id,et.
)ettin& Started with Accordion Panel
Accordion &ane( conit o+ one or "ore tab and each tab can ,rou& any content. 9it(e can a(o be
de+ined 'ith tit(e +acet.
<p:accordion#anel>
<p:ta- title'(6irst !a- !itle(>
<h:output!e&t value' (7orem(/>
...5ore content for first ta-
</p:ta->
<p:ta- title'(8econd !a- !itle(>
<h:output!e&t value'(Ipsum( />
</p:ta->
//any num-er of ta-s
</p:accordion#anel>
Dynamic $ontent *oadin&
Accordion!ane( u&&ort (a=y (oadin, o+ tab contentE 'hen dyna"ic o&tion i et trueE on(y active
tab content 'i(( be rendered to the c(ient ide and c(ic3in, an inactive tab header 'i(( do an a/a0
reCuet to (oad the tab content.
9hi +eature i ue+u( to reduce band'idth and &eed u& &a,e (oadin, ti"e. 1y de+au(t activatin, a
&reviou(y (oaded dyna"ic tab doe not initiate a reCuet to (oad the content a,ain a tab i cached.
9o contro( thi behavior ue cache o&tion.
15
<p:accordion#anel dynamic'(true(>
//..ta-s
</p:accordion#anel>
$lient Side $allbac+s
onTabChange i ca((ed be+ore a tab i ho'n and onTabShow i ca((ed a+ter. 1oth receive container
e(e"ent o+ the tab to ho' a the &ara"eter.
<p:accordion#anel on!a-hange'(handlehange9panel:(>
//..ta-s
</p:accordion#anel>
<script type'(te&t/,avascript(>
function handlehange9panel: /
//panel: new ta- content container
0
</script>
A,a- .ehaior /ents
tabChange i the one and on(y a/a0 behavior event o+ accordion &ane( that i e0ecuted 'hen a tab i
to,,(ed.
<p:accordion#anel>
<p:a,a& event'ta-hange listener'./-ean.onhange0 />
</p:accordion#anel>
pu-lic void onhange9!a-hange$vent event: /
//!a- active!a- ' event.get!a-9:;
//...
0
Mour (itener?i+ de+ined@ 'i(( be invo3ed 'ith an org.primefaces.event.TabChangeEvent intance
that contain a re+erence to the ne' active tab and the accordion &ane( ite(+.
Dynamic 0umber o% 1abs
When the tab to di&(ay are not taticE ue the bui(tBin iteration +eature i"i(ar to uiNre&eat.
<p:accordion#anel value'./-ean.list0 var'listItem>
<p:ta- title'(./listItem.property<0(>
<h:output!e&t value' (./listItem.property=0(/>
...5ore content
</p:ta->
</p:accordion#anel>
16
Disabled 1abs
A tab can be diab(ed by ettin, diab(ed attribute to true.
<p:accordion#anel>
<p:ta- title'(6irst !a- !itle( disa-led'true>
<h:output!e&t value' (7orem(/>
...5ore content for first ta-
</p:ta->
<p:ta- title'(8econd !a- !itle(>
</p:ta->
//any num-er of ta-s
</p:accordion#anel>
Multiple Selection
1y de+au(tE on(y one tab at a ti"e can be activeE enab(e multiple "ode to activate "u(ti&(e tab.
<p:accordion#anel multiple'true>
//ta-s
</p:accordion#anel>
$lient Side API
Wid,etN PrimeFaces.widget.AccordionPanel
!et"od Params eturn Type Description
e(ect?inde0@ inde0N Inde0 o+ tab void Activate tab 'ith ,iven inde0.
une(ect?inde0@ inde0N Inde0 o+ tab void Deactivate tab 'ith ,iven inde0.
S+innin&
Accordion!ane( reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. A
3innin, ty(e c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation. #o((o'in, i
the (it o+ tructura( ty(e c(aeK
#lass Applies
.uiBaccordion 8ain container e(e"ent
.uiBaccordionBheader 9ab header
.uiBaccordionBcontent 9ab content
17
#.2 A,a-.ehaior
A/a01ehavior i an e0tenion to tandard +Na/a0.
In%o
9a, aja$
1ehavior Id org.primefaces.component.Aja$%e"avior
1ehavior *(a org.primefaces.component.&e"avior.aja$.Aja$%e"avior
Attributes
(itener nu(( 8ethod
E0&r
8ethod to &roce in &artia( reCuet.
i""ediate +a(e boo(ean 1oo(ean va(ue that deter"ine the &haeIdE 'hen true
action are &roceed at a&&(yLreCuetLva(ueE 'hen +a(e
at invo3eLa&&(ication &hae.
aync +a(e 1oo(ean When et to trueE a/a0 reCuet are not Cueued.
&roce nu(( Strin, *o"&onent?@ to &roce in &artia( reCuet.
u&date nu(( Strin, *o"&onent?@ to u&date 'ith a/a0.
ontart nu(( Strin, *a((bac3 to e0ecute be+ore a/a0 reCuet i be,in.
onco"&(ete nu(( Strin, *a((bac3 to e0ecute 'hen a/a0 reCuet i co"&(eted.
onucce nu(( Strin, *a((bac3 to e0ecute 'hen a/a0 reCuet ucceed.
onerror nu(( Strin, *a((bac3 to e0ecute 'hen a/a0 reCuet +ai(.
,(oba( true 1oo(ean G(oba( a/a0 reCuet are (itened by a/a0Statu co"&onentE
ettin, ,(oba( to +a(e 'i(( not tri,,er a/a0Statu.
de(ay nu(( Strin, I+ (e than delay "i((iecond e(a&e bet'een ca(( to
request! on(y the "ot recent one i ent and a(( other
reCuet are dicarded. I+ thi o&tion i not &eci+iedE or i+
the va(ue o+ delay i the (itera( trin, OnoneO 'ithout the
CuoteE no de(ay i ued.
&artia(Sub"it +a(e 1oo(ean Enab(e eria(i=ation o+ va(ue be(on,in, to the &artia((y
&roceed co"&onent on(y.
diab(ed +a(e 1oo(ean Diab(e a/a0 behavior.
event nu(( Strin, *(ient ide event to tri,,er a/a0 reCuet.
reet>a(ue +a(e 1oo(ean I+ trueE (oca( va(ue o+ in&ut co"&onent to be u&dated
'ithin the a/a0 reCuet 'ou(d be reet.
18
i,noreAutoU&date +a(e 1oo(ean I+ trueE co"&onent 'hich autoU&datePItrueI 'i(( not be
u&dated +or thi reCuet. I+ not &eci+iedE or the va(ue i
+a(eE no uch indication i "ade.
)ettin& Started with A,a-.ehaior
A/a01ehavior i attached to the co"&onent to a/a0i+y.
<h:input!e&t value'(./-ean.te&t0(>
<p:a,a& update'(out( />
</h:input!e&t>
<h:output!e&t id'(out( value'(./-ean.te&t0( />
In the e0a"&(e aboveE each ti"e the in&ut chan,eE an a/a0 reCuet i ent to the erver. When the
re&one i received out&ut te0t 'ith id IoutI i u&dated 'ith va(ue o+ the in&ut.
*istener
In cae you need to e0ecute a "ethod on a bac3in, beanE de+ine a (itenerK
<h:input!e&t id'(counter(>
<p:a,a& update'(out( listener'(./counter=ean.increment0(/>
</h:input!e&t>
<h:output!e&t id'(out( value'(./counter=ean.count0( />
pu-lic class ounter=ean /
private int count;
//getter setter
pu-lic void increment9: /
count>>;
0
0
/ents
De+au(t c(ient ide event are de+ined by co"&onent that u&&ort c(ient behaviorE +or in&ut
co"&onent it i onchange and +or co""and co"&onent it i onclic". In order to override the do"
event to tri,,er the a/a0 reCuet ue event o&tion. In +o((o'in, e0a"&(eE a/a0 reCuet i tri,,ered
'hen 3ey i u& on in&ut +ie(d.
<h:input!e&t id'(firstname( value'(./-ean.te&t0(>
<p:a,a& update'(out( event'(2eyup(/>
</h:input!e&t>
<h:output!e&t id'(out( value'(./-ean.te&t0( />
19
3.3 AjaxExceptionHandler
A/a0E0ce&tion.and(er i a uti(ity co"&onent +or the bui(tBin E0ce&tion.and(er.
In%o
9a, aja$'$ception(andler
*o"&onent *(a org.primefaces.component.aja$e$ception"andler.Aja$'$ception(andler
*o"&onent 9y&e org.primefaces.component.Aja$'$ception(andler
Attributes
id nu(( Strin, UniCue identi+ier o+ the co"&onent.
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the
co"&onent.
bindin, nu(( 7b/ect An e( e0&reion that "a& to a erver ide
UI*o"&onent intance in a bac3in, bean
one0ce&tion nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter a e0ce&tion
'ith thi ty&e occured.
u&date nu(( Strin, *o"&onent to u&date a+ter a e0ce&tion 'ith thi
ty&e occured.
ty&e nu(( Strin, E0ce&tion ty&e to hand(e.
)ettin& Started with A,a-/-ception(andler
!(eae +ind the detai(ed in+or"ation about thi co"&onent at E0ce&tion.and(er ection at Uti(itie
cha&ter.
20
#.' A,a-Status
A/a0Statu i a ,(oba( noti+ier +or a/a0 reCuet.
In%o
9a, aja$)tatus
*o"&onent *(a org.primefaces.component.aja$status.Aja$)tatus
*o"&onent 9y&e org.primefaces.component.Aja$)tatus
Renderer 9y&e org.primefaces.component.Aja$)tatusenderer
Renderer *(a org.primefaces.component.aja$status.Aja$)tatusenderer
Attributes
co"&onent.
ontart nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter a/a0 reCuet
tart.
onco"&(ete nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter a/a0 reCuet
co"&(ete.
onucce nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter a/a0 reCuet
co"&(eted ucce+u((y.
onerror nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen an a/a0
reCuet +ai(.
ty(e nu(( Strin, In(ine ty(e o+ the co"&onent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the co"&onent.
21
)ettin& Started with A,a-Status
A/a0Statu ue +acet to re&reent the reCuet tatu. 8ot co""on ued +acet are start and
complete. Start +acet 'i(( be viib(e once a/a0 reCuet be,in and tay viib(e unti( it co"&(eted.
7nce the a/a0 re&one i received and &a,e i u&datedE tart +acet ,et hidden and co"&(ete +acet
ho' u&.
<p:a,a&8tatus>
<f:facet name'(start(>
<p:graphicImage value'(a,a&loading.gif( />
</f:facet>
<f:facet name'(complete(>
<h:output!e&t value'(Done!( />
</f:facet>
</p:a,a&8tatus>
/ents
.ere i the +u(( (it o+ avai(ab(e event na"eK
defaultN Initia((y viib(e 'hen &a,e i (oaded.
startN 1e+ore a/a0 reCuet be,in.
successN When a/a0 re&one i received 'ithout error.
errorN When a/a0 re&one i received 'ith an htt& error.
completeN When everythin, +inihe.
<p:a,a&8tatus>
<f:facet name'(error(>
<h:output!e&t value'($rror( />
</f:facet>
<f:facet name'(success(>
<h:output!e&t value'(8uccess( />
</f:facet>
<f:facet name'(default(>
<h:output!e&t value'(Idle( />
</f:facet>
<f:facet name'(start(>
<h:output!e&t value'(8ending( />
</f:facet>
<f:facet name'(complete(>
<h:output!e&t value'(Done( />
</f:facet>
</p:a,a&8tatus>
$ustom /ents
#acet are the dec(arative 'ay to ueE i+ youd (i3e to i"&(e"ent advanced cae 'ith cri&tin, you
can ta3e advanta,e o+ onJ ca((bac3 'hich are the event hand(er counter&art o+ the +acet.
<p:a,a&8tatus onstart'(alert9?8tart?:( oncomplete'(alert9?$nd?:(/>
22
A co""an ua,e o+ &ro,ra""atic a&&roach i to i"&(e"ent a cuto" tatu dia(o,K
<p:a,a&8tatus onstart'(#69?status?:.show9:( oncomplete'(#69?status?:.hide9:(/>
<p:dialog widget@ar'(status( modal'(true( closa-le'(false(>
#lease 1ait
</p:dialog>
$lient Side API
Wid,etN PrimeFaces.widget.A#a$Status
tri,,er?event@ eventN <a"e o+ event. void 9ri,,er ,iven event.
S+innin&
A/a0Statu i eCui&&ed 'ith style and styleClass. Sty(in, direct(y a&&(ie to a container e(e"ent
'hich contain the +acet.
<p:a,a&8tatus style'(width:)Ap&;height:)Ap&( ... />
1ips
G Avoid u&datin, a/a0Statu ite(+ to &revent du&(icate +acetQca((bac3 bindin,.
G !rovide a +i0ed 'idthQhei,ht to an in(ine a/a0Statu to &revent &a,e (ayout +ro" chan,in,.
*o"&onent (i3e co""and1utton ha an attribute ?

global! to contro( tri,,erin, o+ A/a0Statu.
G A/a0Statu a(o u&&ort core AS# a/a0 reCuet o+ +Na/a0 a 'e((.
23
#.' Auto$omplete
Auto*o"&(ete &rovide (ive u,,etion 'hi(e an in&ut i bein, ty&ed.
In%o
9a, auto#omplete
*o"&onent *(a org.primefaces.component.autocomplete.Auto#omplete
*o"&onent 9y&e org.primefaces.component.Auto#omplete
Renderer 9y&e org.primefaces.component.Auto#ompleteenderer
Renderer *(a org.primefaces.component.autocomplete.Auto#ompleteenderer
Attributes
co"&onent.
va(ue nu(( 7b/ect >a(ue o+ the co"&onent than can be either an E6
e0&reion o+ a (itera( te0t.
converter nu(( 7b/ect An e( e0&reion or a (itera( te0t that de+ine a
converter +or the co"&onent. When it an E6
e0&reionE it reo(ved to a converter intance.
In cae it a tatic te0tE it "ut re+er to a
converter id.
24
i""ediate +a(e 1oo(ean When et trueE &roce va(idation (o,ic i
e0ecuted at a&&(y reCuet va(ue &hae +or thi
co"&onent.
reCuired +a(e 1oo(ean 8ar3 co"&onent a reCuired.
va(idator nu(( 8ethodE0&r A "ethod e0&reion that re+er to a "ethod
va(idation, the in&ut.
va(ue*han,e6itener nu(( 8ethodE0&r A "ethod e0&reion that re+er to a "ethod +or
hand(in, a va(uchan,eevent.
reCuired8ea,e nu(( Strin, 8ea,e to be di&(ayed 'hen reCuired +ie(d
va(idation +ai(.
converter8ea,e nu(( Strin, 8ea,e to be di&(ayed 'hen converion +ai(.
va(idator8ea,e nu(( Strin, 8ea,e to be di&(ayed 'hen va(idation +ai(.
co"&(ete8ethod nu(( 8ethodE0&r 8ethod &rovidin, u,,etion.
var nu(( Strin, <a"e o+ the iterator ued in &o/o baed
u,,etion.
ite"6abe( nu(( Strin, 6abe( o+ the ite".
ite">a(ue nu(( Strin, >a(ue o+ the ite".
"a0Reu(t un(i"ited Inte,er 8a0i"u" nu"ber o+ reu(t to be di&(ayed.
"inDuery6en,th true Inte,er <u"ber o+ character to be ty&ed be+ore tartin,
to Cuery.
CueryDe(ay )00 Inte,er De(ay to 'ait in "i((iecond be+ore endin,
each Cuery to the erver.
+orceSe(ection +a(e 1oo(ean When enab(edE auto*o"&(ete on(y acce&t in&ut
+ro" the e(ection (it.
ontart nu(( Strin, *(ient ide ca((bac3 to e0ecute be+ore a/a0
reCuet to (oad u,,etion be,in.
onco"&(ete nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter a/a0 reCuet
to (oad u,,etion co"&(ete.
,(oba( true 1oo(ean De+ine 'hether to tri,,er a/a0Statu or not.
cro((.ei,ht nu(( Inte,er De+ine the hei,ht o+ the ite" vie'&ort.
e++ect nu(( Strin, E++ect to ue 'hen ho'in,Qhidin, u,,etion.
e++ectDuration -00 Inte,er Duration o+ e++ect in "i((iecond.
dro&do'n +a(e 1oo(ean Enab(e dro&do'n "ode 'hen et true.
&ane(Sty(e nu(( Strin, In(ine ty(e o+ the ite" container e(e"ent.
25
&ane(Sty(e*(a nu(( Strin, Sty(e c(a o+ the ite" container e(e"ent.
"u(ti&(e nu(( 1oo(ean When trueE enab(e "u(ti&(e e(ection.
&roce nu(( Strin, *o"&onent?@ to &roce on Cuery reCuet.
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to
the in&ut e(e"ent.
a(t nu(( Strin, A(ternate te0tua( decri&tion o+ the in&ut +ie(d.
autoco"&(ete nu(( Strin, *ontro( bro'er autoco"&(ete behavior.
dir nu(( Strin, Direction indication +or te0t that doe not inherit
directiona(ity. >a(id va(ue are 69R and R96.
diab(ed +a(e 1oo(ean Diab(e in&ut +ie(d
(abe( nu(( Strin, A (oca(i=ed uer &reentab(e na"e.
(an, nu(( Strin, *ode decribin, the (an,ua,e ued in the
,enerated "ar3u& +or thi co"&onent.
"a0(en,th nu(( Inte,er 8a0i"u" nu"ber o+ character that "ay be
entered in thi +ie(d.
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut
e(e"ent (oe +ocu.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut
e(e"ent (oe +ocu and it va(ue ha been
"odi+ied ince ,ainin, +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut
e(e"ent i c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut
e(e"ent i doub(e c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut
e(e"ent receive +ocu.
on3eydo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i
&reed do'n over in&ut e(e"ent.
on3ey&re nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i
&reed and re(eaed over in&ut e(e"ent.
on3eyu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i
re(eaed over in&ut e(e"ent.
on"ouedo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer
button i &reed do'n over in&ut e(e"ent
on"oue"ove nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer
button i "oved 'ithin in&ut e(e"ent.
on"oueout nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer
26
button i "oved a'ay +ro" in&ut e(e"ent.
on"oueover nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer
button i "oved onto in&ut e(e"ent.
on"oueu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer
button i re(eaed over in&ut e(e"ent.
one(ect nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen te0t 'ithin
in&ut e(e"ent i e(ected by uer.
&(aceho(der nu(( Strin, S&eci+ie a hort hint.
readon(y +a(e 1oo(ean #(a, indicatin, that thi co"&onent 'i(( &revent
chan,e by the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the
'idth o+ the in&ut e(e"ent.
ty(e nu(( Strin, In(ine ty(e o+ the in&ut e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the in&ut e(e"ent.
tabinde0 nu(( Inte,er !oition o+ the in&ut e(e"ent in the tabbin,
order.
tit(e nu(( Strin, Adviory too(ti& in+or"aton.
ite"9i&8y!oition (e+t to& Strin, !oition o+ ite"ti& corner re(ative to ite".
ite"9i&At!oition ri,ht botto" Strin, !oition o+ ite" corner re(ative to ite"ti&.
cache +a(e 1oo(ean When enab(ed autoco"&(ete cache the earched
reu(t (it.
cache9i"eout )00000 Inte,er 9i"eout va(ue +or cached reu(t.
e"&ty8ea,e nu(( Strin, 9e0t to di&(ay 'hen there i no data to di&(ay.
a&&end9o nu(( Strin, A&&end the over(ay to the e(e"ent de+ined by
earch e0&reion. De+au(t to docu"ent body.
)ettin& Started with Auto$omplete
Auto*o"&(ete i an in&ut co"&onent o it reCuire a va(ue a uua(. Su,,etion are (oaded by
ca((in, a erver ide co"&(ete8ethod that ta3e a in,(e trin, &ara"eter 'hich i the te0t entered.
<p:autoomplete value'(./-ean.te&t0( complete5ethod'(./-ean.complete0( />
27
pu-lic class =ean /
private 8tring te&t;
pu-lic 7ist<8tring> complete98tring Buery: /
7ist<8tring> results ' new <rray7ist<8tring>9:;
for 9int i ' 0; i < *0; i>>:
results.add9Buery > i:;
return results;
0
//getter setter
0
Po,o Support
8ot o+ the ti"eE intead o+ i"&(e trin, you 'ou(d need 'or3 'ith your do"ain ob/ectE
auto*o"&(ete u&&ort thi co""on ue cae 'ith the ue o+ a converter and data iterator.
#o((o'in, e0a"&(e (oad a (it o+ &(ayerE ite"6abe( i the (abe( di&(ayed a a u,,etion and
ite">a(ue i the ub"itted va(ue. <ote that 'hen 'or3in, 'ith &o/oE you need to &(u,Bin your o'n
converter.
<p:autoomplete value'(./player=ean.selected#layer0(
complete5ethod'(./player=ean.complete#layer0(
var'(player(
item7a-el'(./player.name0(
item@alue'(./player0(
converter'(playeronverter(/>
pu-lic class #layer=ean /
private #layer selected#layer;
pu-lic #layer get8elected#layer9: /
return selected#layer;
0
pu-lic void set8elected#layer9#layer selected#layer: /
this.selected#layer ' selected#layer;
0
pu-lic 7ist<#layer> complete98tring Buery: /
7ist<#layer> players ' read#layers6romDatasource9Buery:;
return players;
0
0
pu-lic class #layer /
private 8tring name;
//getter setter
0
28
*imitin& the "esults
<u"ber o+ reu(t ho'n can be (i"itedE by de+au(t there i no (i"it.
<p:autoomplete value'(./-ean.te&t0(
complete5ethod'(./-ean.complete0(
ma&Cesults'(5( />
Minimum 2uery *en&th
1y de+au(t Cuerie are ent to the erver and co"&(ete8ethod i ca((ed a oon a uer tart ty&in,
at the in&ut te0t. 9hi behavior i tuned uin, the min%uery&ength attribute.
<p:autoomplete value'(./-ean.te&t0( complete5ethod'(./-ean.complete0(
minDuery7ength'()( />
With thi ettin,E u,,etion 'i(( tart 'hen uer ty&e the )rd character at the in&ut +ie(d.
2uery Delay
Auto*o"&(ete i o&ti"i=ed uin, query'elay o&tionE by de+au(t auto*o"&(ete 'ait +or )00
"i((iecond to Cuery a u,,etion reCuetE i+ youd (i3e to tune the (oad ba(anceE ,ive a (on,er
va(ue. #o((o'in, auto*o"&(ete 'ait +or 1 econd a+ter uer ty&e an in&ut.
BueryDelay'(*000( />
$ustom $ontent
Auto*o"&(ete can di&(ay cuto" content by netin, co(u"n.
<p:autoomplete value'(./autoomplete=ean.selected#layer0(
complete5ethod'(./autoomplete=ean.complete#layer0(
var'(p( item@alue'(./p0( converter'(player(>

<p:column>
<p:graphicImage value'(/images/-arca/./p.photo0( width'(E0( height'(50(/>
</p:column>
<p:column>
./p.name0 3 ./p.num-er0
</p:column>
</p:autoomplete>
Dropdown Mode
When dro&do'n "ode i enab(edE a dro&do'n button i di&(ayed ne0t to the in&ut +ie(dE c(ic3in,
thi button 'i(( do a earch 'ith an e"&ty CueryE a re,u(ar co"&(ete8ethod i"&(e"entation hou(d
(oad a(( avai(ab(e ite" a a re&one.
dropdown'(true( />
29
Multiple Selection
Auto*o"&(ete u&&ort "u(ti&(e e(ection a 'e((E to ue thi +eature et "u(ti&(e o&tion to true and
de+ine a (it a your bac3end "ode(. #o((o'in, e0a"&(e de"ontrate "u(ti&(e e(ection 'ith
cuto" content u&&ort.
<p:autoomplete id'(advanced( value'(./autoomplete=ean.selected#layers0(
var'(p( item7a-el'(./p.name0( item@alue'(./p0( converter'(player(
multiple'(true(>

<p:column style'(width:A0F;te&t3align:center(>
<p:graphicImage value'(/images/-arca/./p.photo0(/>
</p:column>
<p:column style'(width:G0F(>
</p:column>
</p:autoomplete>
pu-lic class <utoomplete=ean /
private 7ist<#layer> selected#layers;
//...
0
$achin&
Su,,etion can be cached on c(ient ide o that the a"e Cuery doe not do a reCuet 'hich i
(i3e(y to return a"e u,,etion a,ain. 9o enab(e thiE et cache o&tion to true. 9here i a(o a
cacheTimeout o&tion to con+i,ure ho' (on, it ta3e to c(ear a cache auto"atica((y.
cache'(true(/>
30
A,a- .ehaior /ents
Intead o+ 'aitin, +or uer to ub"it the +or" "anua((y to &roce the e(ected ite"E you can enab(e
intant a/a0 e(ection by uin, the itemSelect a/a0 behavior. E0a"&(e be(o' de"ontrate ho' to
di&(ay a "ea,e about the e(ected ite" intant(y.
<p:autoomplete value'(./-ean.te&t0( complete5ethod'(./-ean.complete0(>
<p:a,a& event'(item8elect( listener'(-ean.handle8elect( update'(msg( />
</p:autoomplete>
<p:messages id'msg />
pu-lic class =ean /
pu-lic void handle8elect98elect$vent event: /
O-,ect item ' event.getO-,ect9:;
6aces5essage msg ' new 6aces5essage9(8elected(H (Item:( > item:;
0
//...
0
Mour (itener?i+ de+ined@ 'i(( be invo3ed 'ith an org.primefaces.event.Select intance that contain a
re+erence to the e(ected ite". <ote that auto*o"&(ete a(o u&&ort event inherited +ro" re,u(ar
in&ut te0t uch a b(urE +ocuE "oueover in addition to itemSelect. Si"i(ar(yE item(nselect event i
&rovided +or "u(ti&(e autoco"&(ete 'hen an ite" i re"oved by c(ic3in, the re"ove icon. In thi
cae org.primefaces.event.(nselect intance i &aed to a (itener i+ de+ined.
'vent *istener Parameter +ired
ite"Se(ect or,.&ri"e+ace.event.Se(ectEvent 7n ite" e(ection.
ite"Une(ect or,.&ri"e+ace.event.Une(ectEvent 7n ite" une(ection.
Cuery B 7n Cuery.
Item1ip
Ite"ti& i an advanced bui(tBin too(ti& 'hen "oue i over on u,,eted ite". *ontent o+ the
too(ti& i de+ined via the itemtip +acet.
31
<p:autoomplete value'(./autoomplete=ean.selected#layer*0( id'(-asic#o,o(
var'(p( item7a-el'(./p.name0( item@alue'(./p0( converter'(player(>
<f:facet name'(itemtip(>
<h:panelIrid columns'(A( cellpadding'(5(>
<f:facet name'(header(>
<p:graphicImage value'(/images/-arca/./p.photo0( />
</f:facet>
<h:output!e&t value'(Jame: ( />
<h:output!e&t id'(modelJo( value'(./p.name0( />
<h:output!e&t value'(Jum-er ( />
<h:output!e&t id'(year( value'(./p.num-er0( />
<h:output!e&t value'(#osition ( />
<h:output!e&t value'(./p.position0(/>
</h:panelIrid>
</f:facet>
</p:autoomplete>
$lient Side API
Wid,etN PrimeFaces.widget.AutoComplete
earch?va(ue@ va(ueN 3ey'ord +or earch void Initiate a earch 'ith ,iven va(ue
c(oe?@ B void .ide u,,eted ite" "enu
diab(e?@ B void Diab(e the in&ut +ie(d
enab(e?@ B void Enab(e the in&ut +ie(d
deactivate?@ B void Deactivate earch behavior
activate?@ B void Activate earch behavior
S+innin&
#o((o'in, i the (it o+ tructura( ty(e c(aeK
#lass Applies
.uiBautoco"&(ete *ontainer e(e"ent.
.uiBautoco"&(eteBin&ut In&ut +ie(d.
.uiBautoco"&(eteB&ane( *ontainer o+ u,,etion (it.
.uiBautoco"&(eteBite" 6it o+ ite"
.uiBautoco"&(eteBite" Each ite" in the (it.
.uiBautoco"&(eteBCuery .i,h(i,hted &art in u,,etion.
A 3innin, ty(e c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation.
32
1ips
G Do not +or,et to ue a converter 'hen 'or3in, 'ith &o/o.
Enab(e +orceSe(ection i+ you

d (i3e to acce&t va(ue on(y +ro" u,,eted (it.
G Increae Cuery de(ay to avoid unneceary (oad to erver a a reu(t o+ uer ty&in, +at.
G Ue e"&ty8ea,e o&tion to &rovide +eedbac3 to the uer that there are no u,,etion.
G Enab(e cachin, to avoid du&(icate Cuerie.
33
#.3 .loc+4I
1(oc3UI i ued to b(oc3 interactivity o+ AS# co"&onent 'ith o&tiona( a/a0 inte,ration.
In%o
9a, &loc,-.
*o"&onent *(a org.primefaces.component.&loc,ui.%loc,-.
*o"&onent 9y&e org.primefaces.component.%loc,-.
Renderer 9y&e org.primefaces.component.%loc,-.enderer
Renderer *(a org.primefaces.component.&loc,ui.%loc,-.enderer
Attributes
co"&onent.
tri,,er nu(( Strin, Identi+ier o+ the co"&onent?@ to bind.
34
b(oc3 nu(( Strin, Identi+ier o+ the co"&onent to b(oc3.
b(oc3ed +a(e 1oo(ean 1(oc3 the UI by de+au(t 'hen enab(ed.
)ettin& Started with .loc+4I
1(oc3UI reCuire trigger and bloc" attribute to be de+ined. With the &ecia( a/a0 inte,rationE a/a0
reCuet 'hoe ource are the tri,,er co"&onent 'i(( b(oc3 the ui ontart and unb(oc3 onco"&(ete.
E0a"&(e be(o' b(oc3 the ui o+ the &ane( 'hen ave1tn i c(ic3ed and unb(oc3 'hen a/a0 re&one
i received.
<p:panel id'(pnl( header'(5y #anel(>
//content

<p:command=utton id'(save=tn( value'(8ave( />
</p:panel>
<p:-loc2KI -loc2'(pnl( trigger'(save=tn( />
8u(ti&(e tri,,er are de+ined a a co""a e&arated (it.
<p:-loc2KI -loc2'(pnl( trigger'(save=tnHdelete=tnHupdate=tn( />
$ustom $ontent
In order to di&(ay cuto" content (i3e a (oadin, te0t and ani"ationE &(ace the content inide the
b(oc3UI.
<p:data!a-le id'(data!a-le( var'(car( value'(./ta-le=ean.cars0(
paginator'(true( rows'(*0(>
<p:column>
<h:output!e&t value'(5odel( />
</f:facet>
<h:output!e&t value'(./car.model0( />
</p:column>
//more columns
</p:data!a-le>

<p:-loc2KI -loc2'(data!a-le( trigger'(data!a-le(>
7O<DIJI<-r />
<p:graphicImage value'(/images/a,a&3loader.gif(/>
</p:-loc2KI>
35
$lient Side API
Wid,etN PrimeFaces.widget.)loc"(*
ho'?@ B void 1(oc3 the UI.
hide?@ B void Unb(oc3 the UI
S+innin&
#lass Applies
.uiBb(oc3ui *ontainer e(e"ent.
.uiBb(oc3uiBcontent *ontainer +or cuto" content.
1ips
G 1(oc3UI doe not u&&ort abo(ute or +i0ed &oitioned co"&onent. e.,. dia(o,.
36
#.5 .read$rumb
1readcru"b i a navi,ation co"&onent that &rovide conte0tua( in+or"ation about &a,e hierarchy
in the 'or3+(o'.
In%o
9a, &read#rum&
*o"&onent *(a org.primefaces.component.&readcrum&.%read#rum&
*o"&onent 9y&e org.primefaces.component.%read#rum&
Renderer 9y&e org.primefaces.component.%read#rum&enderer
Renderer *(a org.primefaces.component.&readcrum&.%read#rum&enderer
Attributes
co"&onent.
"ode( nu(( 8enu8ode( 8enu8ode( intance to create "enu
&ro,ra""atica((y
ty(e nu(( Strin, Sty(e o+ "ain container e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ "ain container
ho"eDi&(ay icon Strin, De+ine di&(ay "ode o+ root (in3E va(id va(ue are
IiconI de+au(t and Ite0tI.
37
)ettin& Started with .read$rumb
Ste& are de+ined a chi(d "enuite" co"&onent in breadcru"b.
<p:-readrum->
<p:menuitem la-el'(ategories( url'(.( />
<p:menuitem la-el'(8ports( url'(.( />
//more menuitems
</p:-readrum->
Dynamic Menus
8enu can be created &ro,ra""atica((y a 'e((E ee the dyna"ic "enu &art in "enu co"&onent
ection +or "ore in+or"ation and an e0a"&(e.
S+innin&
1readcru"b reide in a container e(e"ent that style and styleClass o&tion a&&(y. #o((o'in, i the
(it o+ tructura( ty(e c(aeK
)tyle #lass Applies
.uiBbreadcru"b 8ain breadcru"b container e(e"ent.
.uiBbreadcru"b .uiB"enuBite"B(in3 Each "enuite".
.uiBbreadcru"b .uiB"enuBite"Bte0t Each "enuite" (abe(.
.uiBbreadcru"bBchevron Se&erator o+ "enuite".
Tips
G I+ there i a dyna"ic +(o'E ue "ode( o&tion intead o+ creatin, dec(arative &N"enuite"
co"&onent and bind your 8enu8ode( re&reentin, the tate o+ the +(o'.
G 1readcru"b can do a/a0QnonBa/a0 action reCuet a 'e(( ince &N"enuite" ha thi o&tion. In thi
caeE breadcru"b "ut be neted in a +or".
ur( o&tion i the 3ey +or a "enuite"E i+ it i de+inedE it 'i(( 'or3 a a i"&(e (in3. I+ you
d (i3e to
ue "enuite" to e0ecute co""and 'ith or 'ithout a/a0E do not de+ine the ur( o&tion.
38
#.6 .utton
1utton i an e0tenion to the tandard hNbutton co"&onent 'ith 3innin, ca&abi(itie.
In%o
9a, &utton
*o"&onent *(a org.primefaces.component.&utton.%utton
*o"&onent 9y&e org.primefaces.component.%utton
Renderer 9y&e org.primefaces.component.%uttonenderer
Renderer *(a org.primefaces.component.&utton.%uttonenderer
Attributes
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onent.
bindin, nu(( 7b/ect An e( e0&reion that "a& to a erver ide UI*o"&onent
intance in a bac3in, bean.
va(ue nu(( 7b/ect >a(ue o+ the co"&onent than can be either an E6 e0&reion
o+ a (itera( te0t.
outco"e nu(( Strin, Ued to reo(ve a navi,ation cae.
inc(ude>ie'!ara" +a(e 1oo(ean Whether to inc(ude &a,e &ara"eter in tar,et URI
+ra,"ent nu(( Strin, Identi+ier o+ the tar,et &a,e 'hich hou(d be cro((ed to.
diab(ed +a(e 1oo(ean Diab(e button.
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to button.
a(t nu(( Strin, A(ternate te0tua( decri&tion.
i"a,e nu(( Strin, Sty(e c(a +or the button icon. ?de&recatedN ue icon@
(an, nu(( Strin, *ode decribin, the (an,ua,e ued in the ,enerated "ar3u&
39
+or thi co"&onent.
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button (oe +ocu.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button (oe +ocu and
it va(ue ha been "odi+ied ince ,ainin, +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button i c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button i doub(e
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button receive +ocu.
on3eydo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i &reed do'n
over button.
on3ey&re nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i &reed and
re(eaed over button.
on3eyu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i re(eaed over
button.
on"ouedo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button i
&reed do'n over button.
on"oue"ove nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button i
"oved 'ithin button
on"oueout nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button i
"oved a'ay +ro" button.
on"oueover nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button i
"oved onto button.
on"oueu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button i
ty(e nu(( Strin, In(ine ty(e o+ the button.
ty(e*(a nu(( Strin, Sty(e c(a o+ the button.
read7n(y +a(e 1oo(ean 8a3e button read on(y.
tabinde0 nu(( Inte,er !oition in the tabbin, order.
hre+ nu(( Strin, Reource to (in3 direct(y to i"&(e"ent anchor behavior.
icon nu(( Strin, Icon o+ the button.
icon!o (e+t Strin, !oition o+ the button icon.
tar,et Le(+ Strin, 9he 'indo' tar,et.
eca&e true 1oo(ean De+ine 'hether (abe( 'ou(d be eca&ed or not.
in(ine +a(e Strin, Di&(ay button a in(ine intead o+ 100R 'idthE "obi(y
40
on(y.
diab(e*(ientWindo' +a(e 1oo(ean Diab(e a&&endin, the *(ientWindo' on the renderin, o+
thi e(e"ent.
)ettin& Started with .utton
&Nbutton ua,e i a"e a tandard hNbuttonE an outco"e i neceary to navi,ate uin, GE9
reCuet. Au"e you are at ource.0ht"( and need to navi,ate tar,et.0ht"(.
<p:-utton outcome'(target( value'(Javigate(/>
Parameters
!ara"eter in URI are de+ined 'ith neted S+N&ara" QT ta,.
<p:-utton outcome'(target( value'(Javigate(>
<f:param name'(id( value'(*0( />
</p:-utton>
Icons
Icon +or button are de+ined via c and icon attributeE i+ you ue tit(e intead o+ va(ueE on(y icon
'i(( be di&(ayed and tit(e te0t 'i(( be di&(ayed a too(ti& on "oueover. Mou can a(o ue icon
+ro" !ri"e#ace the"e uch uiBiconBchec3.
<p:-utton outcome'(target( icon'(star( value'(1ith Icon(/>
<p:-utton outcome'(target( icon'(star( title'(1ith Icon(/>
.star /
-ac2ground3image: url9(images/star.png(:;
0
S+innin&
1utton render a button ta, 'hich style and styleClass a&&(ie. A 3innin, ty(e c(ae are ,(oba(E
ee the "ain the"in, ection +or "ore in+or"ation. #o((o'in, i the (it o+ tructura( ty(e c(aeK
)tyle #lass Applies
.uiBbutton 1utton e(e"ent
.uiBbuttonBte0tBon(y 1utton e(e"ent 'hen icon i not ued
.uiBbuttonBte0t 6abe( o+ button
41
#.7 $ache
*ache co"&onent i ued to reduce &a,e (oad ti"e by cachin, the content a+ter initia( renderin,.

In%o
9a, cac"e
*o"&onent *(a org.primefaces.component.cac"e.-.#ac"e
*o"&onent 9y&e org.primefaces.component.#ac"e
Renderer 9y&e org.primefaces.component.-.#ac"eenderer
Renderer *(a org.primefaces.component.cac"e.-.#ac"eenderer
Attributes
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE
'hen et to +a(e co"&onent 'i(( not be rendered.
diab(ed +a(e 1oo(ean Diab(e cachin,.
re,ion >ie' Id Strin, UniCue id o+ the cache re,ionE de+au(t to vie' id.
3ey nu(( Strin, UniCue id o+ the cache entry in re,ionE de+au(t to c(ient id o+
co"&onent.
)ettin& Started with $ache
A cache tore i reCuired to ue the cache co"&onentE t'o di++erent &rovider are u&&orted a
cache i"&(e"entationK E.*ache and .a=e(cat. !rovider i con+i,ured via a conte0tB&ara".
<conte&t3param>
<param3name>primefaces.<4$L#CO@ID$C</param3name>
<param3value>org.primefaces.cache.$4ache#rovider</param3value>
</conte&t3param>
.ere i a a"&(e ehcache.0"( to con+i,ure cache re,ionE there are t'o re,ion in thi
con+i,uration.
42
<M&ml version'(*.0( encoding'(K!63G(M>
<ehcache &mlns:&si'(http://www.w).org/A00*/N578chema3instance(
&si:noJamespace8chema7ocation'(ehcache.&sd(
updatehec2'(true( monitoring'(autodetect(
dynamiconfig'(true(>
<dis28tore path'(,ava.io.tmpdir(/>
<defaultache
ma&$ntries7ocal4eap'(*0000(
eternal'(false(
time!oIdle8econds'(*A0(
time!o7ive8econds'(*A0(
dis28pool=uffer8iOe5='()0(
ma&$ntries7ocalDis2'(*0000000(
dis2$&piry!hreadInterval8econds'(*A0(
memory8tore$viction#olicy'(7CK(>
<persistence strategy'(local!emp8wap(/>
</defaultache>
<cache name'(testcache(
ma&$ntries7ocal4eap'(*0000(
eternal'(false(
time!oIdle8econds'(*A0(
time!o7ive8econds'(*A0(
dis28pool=uffer8iOe5='()0(
ma&$ntries7ocalDis2'(*0000000(
dis2$&piry!hreadInterval8econds'(*A0(
memory8tore$viction#olicy'(7CK(>
<persistence strategy'(local!emp8wap(/>
</cache>
</ehcache>
A+ter the con+i,urationE at UI ideE the cached &art need to be 'ra&&ed inide the &Ncache
co"&onent.
<p:cache>
//content to cache
</p:cache>
7nce the &a,e i (oaded initia((yE content inide &Ncache co"&onent i cached inide the cache
re,ion o+ the cache &rovider. !otbac3 on the a"e &a,e or reo&enin, the &a,e retrieve the out&ut
+ro" cache intead o+ renderin, the content re,u(ar(y.
$ache Proider API
*ache!rovider can be acceed viaK
+equestConte$t.getCurrent*nstance!.getApplicationConte$t!.getCacheProvider!
#or e0a"&(e uin, thi A!IE a(( cache re,ion can be c(eaned uin, clear! "ethod. Re+er to /avadoc
o+ *ache!rovider +or the +u(( (it o+ avai(ab(e "ethod.
43
#.8 $alendar
*a(endar i an in&ut co"&onent ued to e(ect a date +eaturin, di&(ay "odeE &a,in,E (oca(i=ationE
a/a0 e(ection and "ore.
In%o
9a, calendar
*o"&onent *(a org.primefaces.component.calendar.#alendar
*o"&onent 9y&e org.primefaces.component.#alendar
Renderer 9y&e org.primefaces.component.#alendarenderer
Renderer *(a org.primefaces.component.calendar.#alendarenderer
Attributes
co"&onent.
va(ue nu(( /ava.uti(
.Date
>a(ue o+ the co"&onent
converter nu(( *onvert
erQStrin
,
An e( e0&reion or a (itera( te0t that de+ine a
e0&reionE it reo(ved to a converter intance. In
cae it a tatic te0tE it "ut re+er to a converter id
i""ediate +a(e 1oo(ean When et trueE &roce va(idation (o,ic i e0ecuted
at a&&(y reCuet va(ue &hae +or thi co"&onent.
reCuired +a(e 1oo(ean 8ar3 co"&onent a reCuired
44
va(idator nu(( 8ethod
E0&r
A "ethod e0&reion that re+er to a "ethod
va(idation, the in&ut
va(ue*han,e6itener nu(( 8ethod
E0&r
A "ethod e0&reion that re+er to a "ethod +or
hand(in, a va(uchan,eevent
va(idation +ai(.
"indate nu(( Date or
Strin,
Set ca(endarO "ini"u" viib(e date
"a0date nu(( Date or
Strin,
Set ca(endarO "a0i"u" viib(e date
&a,e 1 Inte,er Enab(e "u(ti&(e &a,e renderin,.
diab(ed +a(e 1oo(ean Diab(e the ca(endar 'hen et to true.
"ode &o&u& Strin, De+ine ho' the ca(endar 'i(( be di&(ayed.
&attern 88QddQyyyy Strin, Date#or"at &attern +or (oca(i=ation
(oca(e nu(( 7b/ect 6oca(e to be ued +or (abe( and converion.
&o&u&Icon nu(( Strin, Icon o+ the &o&u& button
&o&u&Icon7n(y +a(e 1oo(ean When enab(edE &o&u& icon i rendered 'ithout the
button.
navi,ator +a(e 1oo(ean Enab(e "onthQyear navi,ator
ti"eUone nu(( 9i"e
Uone
Strin, or a /ava.uti(.9i"eUone intance to &eci+y
the ti"e=one ued +or date converionE de+au(t to
9i"eUone.,etDe+au(t?@
readon(yIn&ut +a(e 1oo(ean 8a3e in&ut te0t o+ a &o&u& ca(endar readon(y.
ho'1utton!ane( +a(e 1oo(ean >iibi(ity o+ button &ane( containin, today and done
button.
e++ect nu(( Strin, E++ect to ue 'hen di&(ayin, and ho'in, the
&o&u& ca(endar.
e++ectDuration nor"a( Strin, Duration o+ the e++ect.
ho'7n both Strin, *(ient ide event that di&(ay the &o&u& ca(endar.
ho'Wee3 +a(e 1oo(ean Di&(ay the 'ee3 nu"ber ne0t to each 'ee3.
diab(edWee3end +a(e 1oo(ean Diab(e 'ee3end co(u"n.
45
ho'7ther8onth +a(e 1oo(ean Di&(ay day be(on,in, to other "onth.
e(ect7ther8onth +a(e 1oo(ean Enab(e e(ection o+ day be(on,in, to other
"onth.
yearRan,e nu(( Strin, Mear ran,e +or the navi,atorE de+au(t IcB10NcH10I
ti"e7n(y +a(e 1oo(ean Sho' on(y ti"e&ic3er 'ithout date.
te&.our 1 Inte,er .our te&.
te&8inute 1 Inte,er 8inute te&.
te&Second 1 Inte,er Second te&.
"in.our 0 Inte,er 8ini"u" boundary +or hour e(ection.
"a0.our %) Inte,er 8a0i"u" boundary +or hour e(ection.
"in8inute 0 Inte,er 8ini"u" boundary +or "inute e(ection.
"a08inute 59 Inte,er 8a0i"u" boundary +or hour e(ection.
"inSecond 0 Inte,er 8ini"u" boundary +or econd e(ection.
"a0Second 59 Inte,er 8a0i"u" boundary +or econd e(ection.
&a,edate nu(( 7b/ect Initia( date to di&(ay i+ va(ue i nu((.
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to the
in&ut e(e"ent.
(an, nu(( Strin, *ode decribin, the (an,ua,e ued in the ,enerated
"ar3u& +or thi co"&onent.
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
(oe +ocu.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
(oe +ocu and it va(ue ha been "odi+ied ince
,ainin, +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute onc(ic3 event.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
46
i doub(e c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
receive +ocu.
chan,e by the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the 'idth
o+ the in&ut e(e"ent.
tabinde0 nu(( Inte,er !oition o+ the in&ut e(e"ent in the tabbin, order.
be+oreSho'Day nu(( Strin, *(ient ide ca((bac3 to e0ecute be+ore di&(ayin, a
dateE ued to cuto"i=e date di&(ay.
"a3 nu(( Strin, A&&(ie a "a3 uin, the &attern.
47
)ettin& Started with $alendar
>a(ue o+ the ca(endar hou(d be a /ava.uti(.Date.
<p:calendar value'(./date=ean.date0(/>
pu-lic class Date=ean /
private Date date;
//Ietter and 8etter
0
Display Modes
*a(endar ha t'o "ain di&(ay "odeE popup ?de+au(t@ and inline.
In(ine
<p:calendar value'(./date=ean.date0( mode'(inline( />
!o&u&
<p:calendar value'(./date=ean.date0( mode'(popup( />
show,n o&tion de+ine the c(ient ide event to di&(ay the ca(endar. >a(id va(ue areK
G +ocuN When in&ut +ie(d receive +ocu
G buttonN When &o&u& button i c(ic3ed
bothN 1oth
focus and button cae
48
!o&u& 1utton
<p:calendar value'(./date=ean.date0( mode'(popup( showOn'(-utton( />
!o&u& Icon 7n(y
<p:calendar value'(./date=ean.date0( mode'(popup(
showOn'(-utton( popupIconOnly'(true( />
Pa&in&
*a(endar can a(o be rendered in "u(ti&(e &a,e 'here each &a,e corre&ond to one "onth. 9hi
+eature i tuned 'ith the pages attribute.
<p:calendar value'(./dateontroller.date0( pages'()(/>
*ocali9ation
1y de+au(t (oca(e in+or"ation i retrieved +ro" the vie' (oca(e and can be overridden by the (oca(e
attribute. 6oca(e attribute can ta3e a (oca(e 3ey a a Strin, or a /ava.uti(.6oca(e intance. De+au(t
(an,ua,e o+ (abe( are En,(ih and you need to add the neceary tran(ation to your &a,e "anua((y
a !ri"e#ace doe not inc(ude (an,ua,e tran(ation. !ri"e#ace Wi3i !a,e +or
49
!ri"e#ace6oca(e i a co""unity driven &a,e 'here you "ay +ind the tran(ation you need.
!(eae contribute to thi 'i3i 'ith your o'n tran(ation.
http://wi2i.primefaces.org/display/omponents/#rime6aces>7ocales
9ran(ation i a i"&(e /avacri&t ob/ectE 'e u,,et addin, the code to a /avacri&t +i(e and inc(ude
in your a&&(ication. #o((o'in, i a 9ur3ih ca(endar.
<h:output8cript name'pathLtoLyourLtranslations.,s />
<p:calendar value'(./dateontroller.date0( locale'(tr( navigator'(true(
show=utton#anel'(true(/>
9o override ca(cu(ated &attern +ro" (oca(eE ue the &attern o&tionK
<p:calendar value'(./dateontroller.date*0( pattern'(dd.55.yyyy(/>
<p:calendar value'(./dateontroller.dateA0( pattern'(yyH 5H d(/>
<p:calendar value'(./dateontroller.date)0( pattern'($$$H dd 555H yyyy(/>
/%%ects
>ariou e++ect can be ued 'hen ho'in, and hidin, the &o&u& ca(endarE o&tion areK ho'E
(ideDo'nE +adeInE b(indE bounceE c(i&E dro&E +o(d and (ide.
A,a- .ehaior /ents
*a(endar &rovide a dateSelect a/a0 behavior event to e0ecute an intant a/a0 e(ection 'henever a
date i e(ected. I+ you de+ine a "ethod a a (itenerE it 'i(( be invo3ed by &ain, an
org.primefaces.event.SelectEvent intance.
50
<p:calendar value'(./calendar=ean.date0(>
<p:a,a& event'date8elect listener'./-ean.handleDate8elect0 update'msg />
</p:calendar>
<p:messages id'(msg( />
pu-lic void handleDate8elect98elect$vent event: /
Date date ' 9Date: event.getO-,ect9:;
//<dd facesmessage
0
In &o&u& "odeE ca(endar a(o u&&ort re,u(ar a/a0 behavior event (i3e b(urE 3eyu& and "ore.
Date "an&es
Uin, "indate and "a0date o&tionE e(ectab(e date can be retricted. >a(ue +or thee attribute
can either be a trin, or a /ava.uti(.Date.
<p:calendar value'(./date=ean.date0( mode'(inline(
mindate'(0P/*0/A0*0( ma&date'(0P/*5/A0*0(/>
0ai&ator
<avi,ator i an eay 'ay to /u"& bet'een "onthQyear Cuic3(y.
<p:calendar value'(./date=ean.date0( mode'(inline( navigator'(true( />
1imePic+er
9i"e!ic3er +unctiona(ity i enab(ed by addin, ti"e +or"at to your &attern.
<p:calendar value'(./date=ean.date0( pattern'55/dd/yyyy 44:mm />
51
Adanced $ustomi9ation
Ue be+oreSho'Day /avacri&t ca((bac3 to cuto"i=e the (oo3 o+ each date. 9he +unction return an
array 'ith t'o va(ueE +irt one i +(a, to indicate i+ date 'ou(d be di&(ayed a enab(ed and econd
&ara"eter i the o&tiona( ty(e c(a to add to date ce((. #o((o'in, e0a"&(e diab(ed tueday and
+riday.
<p:calendar value'(./date=ean.date0( -efore8howDay'(tuesdays<nd6ridaysOnly( />
6unction tuesdays<nd6ridaysDisa-led9date: /
var day ' date.getDay9:;
return Q9day !' A RR day !' 5:H ??S
0
Mas+
*a(endar ha a bui(tBin "a3 +eature i"i(ar to the In&ut8a3 co"&onent. Set mas" o&tion to true to
enab(e "a3 u&&ort.
$lient Side API
Wid,etN PrimeFaces.widget.Calendar
,etDate?@ B Date Return e(ected date
etDate?date@ dateN Date to di&(ay void Set di&(ay date
diab(e?@ B void Diab(e ca(endar
enab(e?@ B void Enab(e ca(endar
S+innin&
*a(endar reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y.
52
)tyle #lass Applies
.uiBdate&ic3er 8ain container
.uiBdate&ic3erBheader .eader container
.uiBdate&ic3erB&rev !reviou "onth navi,ator
.uiBdate&ic3erBne0t <e0t "onth navi,ator
.uiBdate&ic3erBtit(e 9it(e
.uiBdate&ic3erB"onth 8onth di&(ay
.uiBdate&ic3erBtab(e Date tab(e
.uiBdate&ic3erB'ee3Bend 6abe( o+ 'ee3end
.uiBdate&ic3erBotherB"onth Date be(on,in, to other "onth
.uiBdate&ic3er td Each ce(( date
.uiBdate&ic3erBbutton&ane 1utton &ane(
.uiBdate&ic3erBcurrent 9oday button
.uiBdate&ic3erBc(oe *(oe button
53
#.1: $aptcha
*a&tcha i a +or" va(idation co"&onent baed on Reca&tcha A!I.

In%o
9a, captc"a
*o"&onent *(a org.primefaces.component.captc"a.#aptc"a
*o"&onent 9y&e org.primefaces.component.#aptc"a
Renderer 9y&e org.primefaces.component.#aptc"aenderer
Renderer *(a org.primefaces.component.captc"a.#aptc"aenderer
Attributes
co"&onentE 'hen et to +a(e co"&onent 'i(( not
be rendered.
converter nu(( *onverterQStri
n,
e0&reionE it reo(ved to a converter intance.
In cae it a tatic te0tE it "ut re+er to a converter
id.
co"&onent.
54
va(idator nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a
"ethod va(idation, the in&ut.
va(ue*han,e6itener nu(( >a(ue*han,e
6itener
A "ethod bindin, e0&reion that re+er to a
"ethod +or hand(in, a va(uchan,eevent.
va(idation +ai(.
va(idator8ea,e nu(( Strin, 8ea,e to be di&(ayed 'hen va(idation +ie(d.
&ub(ic;ey nu(( Strin, !ub(ic reca&tcha 3ey +or a &eci+ic do"ain
?de&recated@
the"e red Strin, 9he"e o+ the ca&tcha.
(an,ua,e en Strin, ;ey o+ the u&&orted (an,ua,e.
(abe( nu(( Strin, Uer &reentab(e +ie(d na"e.
ecure +a(e 1oo(ean Enab(e htt& u&&ort
)ettin& Started with $aptcha
*at&cha i i"&(e"ented a an in&ut co"&onent 'ith a bui(tBin va(idator that i inte,rated 'ith
re*a&tcha. #irt thin, to do i to i,n u& to re*a&tcha to ,et &ub(ic:&rivate 3ey. 7nce you have
the 3ey +or your do"ainE add the" to 'eb.0"( a +o((o'K
<conte&t3param>
<param3name>primefaces.#CI@<!$L<#!4<LT$"</param3name>
<param3value>"OKCL#CI@<!$LT$"</param3value>
</conte&t3param>
<conte&t3param>
<param3name>primefaces.#K=7IL<#!4<LT$"</param3name>
<param3value>"OKCL#K=7ILT$"</param3value>
</conte&t3param>
9hat i itE no' you can ue ca&tcha a +o((o'K
<p:captcha />
1hemes
*a&tcha +eature +o((o'in, bui(tBin the"e +or (oo3 and +ee( cuto"i=ationK
B red ?de+au(t@
B 'hite
B b(ac3,(a
B c(ean
9he"e are a&&(ied via the the"e attribute.
55
<p:captcha theme'(white(/>
*an&ua&es
9e0t intruction di&(ayed on ca&tcha i cuto"i=ed 'ith the language attribute. 1e(o' i a ca&tcha
'ith 9ur3ih te0t.
<p:captcha language'(tr(/>
;erridin& <alidation Messa&es
1y de+au(t ca&tcha di&(ay it o'n va(idation "ea,eE thi can be eai(y overridden by the AS#
"ea,e bund(e "echani". *orre&ondin, 3ey areK
Su""ary &ri"e+ace.ca&tcha.I<>A6ID
Detai( &ri"e+ace.ca&tcha.I<>A6IDLdetai(
1ips
G Ue (abe( o&tion to &rovide readab(e error "ea,e in cae va(idation +ai(.
Enab(e
secure o&tion to u&&ort htt& other'ie bro'er 'i(( ,ive 'arnin,.
See
htt&NQQ'''.,oo,(e.co"Qreca&tchaQ(earn"ore to (earn "ore about ho' re*a&tcha 'or3.
56
#.11 $arousel
*aroue( i a "u(ti &ur&oe co"&onent to di&(ay a et o+ data or ,enera( content 'ith (ide e++ect.

In%o
9a, carousel
*o"&onent *(a org.primefaces.component.carousel.#arousel
*o"&onent 9y&e org.primefaces.component.#arousel
Renderer 9y&e org.primefaces.component.#arouselenderer
Renderer *(a org.primefaces.component.carousel.#arouselenderer
Attributes
co"&onentE 'hen et to +a(e co"&onent 'i(( not be
rendered.
va(ue nu(( 7b/ect A va(ue e0&reion that re+er to a co((ection
var nu(( Strin, <a"e o+ the reCuet co&ed iterator
nu">iib(e ) Inte,er <u"ber o+ viib(e ite" &er &a,e
+irt>iib(e 0 Inte,er Inde0 o+ the +irt e(e"ent to be di&(ayed
circu(ar +a(e 1oo(ean Set continuou cro((in,
vertica( +a(e 1oo(ean Set vertica( cro((in,
auto!(ayInterva( 0 Inte,er Set the ti"e in "i((iecond to have *aroue( tart
57
cro((in, auto"atica((y a+ter bein, initia(i=ed
&a,e6in3 ) Inte,er De+ine the nu"ber o+ &a,e (in3 o+ &a,inator.
e++ect (ide Strin, <a"e o+ the ani"ationE cou(d be +ade or (ide.
eain, eaeIn7ut*irc Strin, <a"e o+ the eain, ani"ation.
e++ectDuration 500 Inte,er Duration o+ the ani"ation in "i((iecond.
dro&do'n9e"&(ate. V&a,eW Strin, 9e"&(ate trin, +or dro&do'n o+ &a,inator.
ty(e nu(( Strin, In(ine ty(e o+ the co"&onent..
ty(e*(a nu(( Strin, Sty(e c(a o+ the co"&onent..
ite"Sty(e nu(( Strin, In(ine ty(e o+ each ite".
ite"Sty(e*(a nu(( Strin, Sty(e c(a o+ each ite".
header9e0t nu(( Strin, 6abe( +or header.
+ooter9e0t nu(( Strin, 6abe( +or +ooter.
)ettin& Started with $arousel
*aroue( ha t'o "ain ueBcaeK data and ,enera( content di&(ay. 9o be,in 'ith data iteration (et
ue a (it o+ car to di&(ay 'ith caroue(.
pu-lic class ar /
private 8tring model;
private int year;
private 8tring manufacturer;
private 8tring color;
...
0
pu-lic class ar=ean /
private 7ist<ar> cars;
pu-lic ar7istontroller9: /
cars ' new <rray7ist<ar>9:;
cars.add9new ar9(my5odel(H A005H (5anufacturerN(H (-lue(::;
//add more cars
0
//getter setter
0
58
<p:carousel value'(./car=ean.cars0( var'(car( item8tyle'(width:A00p&(>
<p:graphicImage value'(/images/cars/./car.manufacturer0.,pg(/>
<h:output!e&t value'(5odel: ./car.model0( />
<h:output!e&t value'("ear: ./car.year0( />
<h:output!e&t value'(olor: ./car.color0( />
</p:carousel>
*aroue( iterate throu,h the car co((ection and render it chi(dren +or each carE note that you a(o
need to de+ine a 'idth +or each ite".
*imitin& <isible Items
1u de+au(t caroue( (it it ite" in &a,e 'ith i=e ). 9hi i cuto"i=ab(e 'ith the ro' attribute.
<p:carousel value'(./car=ean.cars0( var'(car( num@isi-le'(*(
item8tyle'(width:A00p&( >
...
</p:carousel>
/%%ects
!a,in, ha&&en 'ith a (ider e++ect by de+au(t and +o((o'in, eain, o&tion are u&&orted.
G bac31oth
G bac3In
G bac37ut
G bounce1oth
G bounceIn
G bounce7ut
G eae1oth
G eae1othStron,
G eaeIn
G eaeInStron,
G eae<one
G eae7ut
G eaeIn7ut*irc
G eae7utStron,
G e(atic1oth
G e(aticIn
G e(atic7ut
59
SlideShow
*aroue( can di&(ay the content in a (ideho'E +or thi &ur&oe autoPlay*nterval and circular
attribute are ued. #o((o'in, caroue( di&(ay a co((ection o+ i"a,e a a (ideho'.
<p:carousel auto#layInterval'(A000( rows'(*( effect'(easeIn8trong( circular'(true(
item8tyle'width:A00p& >
<p:graphicImage value'(/images/nature*.,pg(/>
<p:graphicImage value'(/images/natureA.,pg(/>
<p:graphicImage value'(/images/nature).,pg(/>
<p:graphicImage value'(/images/natureE.,pg(/>
</p:carousel>
$ontent Display
Another ue cae o+ caroue( i tab baed content di&(ay.
<p:carousel rows'(*( item8tyle'(height:A00p&;width:U00p&;(>
<p:ta- title'(Iodfather #art I(>
<h:panelIrid columns'(A( cellpadding'(*0(>
<p:graphicImage value'(/images/godfather/godfather*.,pg( />
<h:output!e&t value'(!he story -egins as Don @ito ...( />
</h:panelIrid>
</p:ta->
<p:ta- title'(Iodfather #art II(>
<p:graphicImage value'(/images/godfather/godfatherA.,pg( />
<h:output!e&t value'(6rancis 6ord oppola?s ...(/>
</h:panelIrid>
</p:ta->
<p:ta- title'(Iodfather #art III(>
<p:graphicImage value'(/images/godfather/godfather).,pg( />
<h:output!e&t value'(<fter a -rea2 of ...( />
</h:panelIrid>
</p:ta->
</p:carousel>
60
Item Selection
Sa"&(e be(o' e(ect an ite" +ro" the caroue( and di&(ay detai( 'ithin a dia(o,.
<h:form id'form(>
<p:carousel value'(./car=ean.cars0( var'(car( item8tyle'width:A00p& >
<p:command7in2 update'(:form:detail( oncomplete'(#69?dlg?:.show9:(>
<h:output!e&t value'(5odel: ./car.model0( />
<f:set#roperty<ction7istener value'(./car0( target'(./car=ean.selected0( />
</p:command7in2>
</p:carousel>
<p:dialog widget@ar'(dlg(>
<h:output!e&t id'(detail( value'(./car=ean.selected0( />
</p:dialog>
</h:form>
private ar selected;
//getters and setters
0
(eader and Footer
.eader and #ooter o+ caroue( can be de+ined in t'o 'ay eitherE uin, headerTe$t and footerTe$t
o&tion that ta3e i"&(e trin, a (abe( or by header and footer +acet that can ta3e any cuto"
content.
$lient Side API
Wid,etN PrimeFaces.widget.Carousel
ne0t?@ B void Di&(ay ne0t &a,e.
&rev?@ B void Di&(ay &reviou &a,e.
et!a,e?@ inde0 void Di&(ay &a,e 'ith ,iven inde0.
tartAuto&(ay?@ B void Start (ideho'.
to&Auto&(ay?@ B void Sto& (ideho'.
61
S+innin&
*aroue( reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. itemStyle and
itemStyleClass attribute a&&(y to each ite" di&(ayed by caroue(. #o((o'in, i the (it o+ tructura(
ty(e c(aeK
)tyle #lass Applies
.uiBcaroue( 8ain container
.uiBcaroue(Bheader .eader container
.uiBcaroue(BheaderBtit(e .eader content
.uiBcaroue(Bvie'&ort *ontent container
.uiBcaroue(Bbutton <avi,ation button
.uiBcaroue(Bne0tBbutton <e0t navi,ation button o+ &a,inator
.uiBcaroue(B&revBbutton !rev navi,ation button o+ &a,inator
.uiBcaroue(B&a,eB(in3 !a,e (in3 o+ &a,inator.
.uiBcaroue(B&a,eB(in3 Each &a,e (in3 o+ &a,inator.
.uiBcaroue(Bite" Each ite".
62
#.12 $ell/ditor
*e((Editor i a he(&er co"&onent o+ datatab(e ued +or ince(( editin,.
In%o
9a, cell'ditor
*o"&onent *(a org.primefaces.component.celleditor.#ell'ditor
*o"&onent 9y&e org.primefaces.component.#ell'ditor
Renderer 9y&e org.primefaces.component.#ell'ditorenderer
Renderer *(a org.primefaces.component.celleditor.#ell'ditorenderer
Attributes
be rendered.
)ettin& Started with $ell/ditor
See in(ine editin, ection in datatab(e docu"entation +or "ore in+or"ation about ua,e.
63
#.1# $hart
*hart co"&onent i a ,eneric ,ra&h co"&onent to create variou ty&e o+ chart uin, /C&(ot (ibrary.
Each chart ty&e ha it o'n ubection 'ith code e0a"&(e and ection ).1%.10 docu"ent the +u((
chartin, A!I.
In%o
9a, c"art
*o"&onent *(a org.primefaces.component.c"art.#"art
*o"&onent 9y&e org.primefaces.component.#"art
Renderer 9y&e org.primefaces.component.#"artenderer
Renderer *(a org.primefaces.component.c"art.#"artenderer
Attributes
be rendered.
ty&e nu(( Strin, 9y&e o+ the chart.
"ode( nu(( *hart8ode( 8ode( ob/ect o+ data and ettin,.
64
3.13.1 PieChart
!ie*hart i created 'ith !ie*hart8ode(.
.asic
<p:chart type'(pie( value'(./-ean.model0( />
pu-lic class =ean /
private #iehart5odel model;
pu-lic =ean9: /
model ' new #iehart5odel9:;
model.set9(=rand *(H 5E0:;
model.set9(=rand A(H )A5:;
model.set9(=rand )(H P0A:;
model.set9(=rand E(H EA*:;
model.set!itle9(8imple #ie(:;
model.set7egend#osition9(w(:;
0
pu-lic #iehart5odel get5odel9: /
return model;
0
0
$ustomi9ed
<p:chart type'(pie( value'(./-ean.model0( />
65
pu-lic class =ean /
pu-lic =ean9: /
model.set!itle9(ustom #ie(:;
model.set7egend#osition9(e(:;
model.set6ill9false:;
model.set8howData7a-els9true:;
model.setDiameter9*50:;
0
pu-lic #iehart5odel get5odel9: /
return model;
0
0
66
3.13.2 LineChart
6ine*hart8ode( i ued to create a (ine chart.
.asic
<p:chart type'(line( value'(./-ean.model0( />
pu-lic class =ean /
private 7inehart5odel model;
pu-lic =ean9: /
model ' new 7inehart5odel9:;

7inehart8eries series* ' new 7inehart8eries9:;
series*.set7a-el9(8eries *(:;
series*.set9*H A:;
series*.set9AH *:;
series*.set9)H ):;
series*.set9EH U:;
series*.set95H G:;

7inehart8eries seriesA ' new 7inehart8eries9:;
seriesA.set7a-el9(8eries A(:;
seriesA.set9*H U:;
seriesA.set9AH ):;
seriesA.set9)H A:;
seriesA.set9EH P:;
seriesA.set95H +:;

model.add8eries9series*:;
model.add8eries9seriesA:;
model.set!itle9(7inear hart(:;
<&is y<&is ' model.get<&is9<&is!ype.":;
y<&is.set5in90:;
y<&is.set5a&9*0:;
0
pu-lic 7inehart5odel get5odel9: /
return model;
0
0
67
$ustomi9ed
pu-lic class =ean /
pu-lic =ean9: /

hart8eries -oys ' new hart8eries9:;
-oys.set7a-el9(=oys(:;
-oys.set9(A00E(H *A0:;
-oys.set9(A005(H *00:;
-oys.set9(A00U(H EE:;
-oys.set9(A00P(H *50:;
-oys.set9(A00G(H A5:;

hart8eries girls ' new hart8eries9:;
girls.set7a-el9(Iirls(:;
girls.set9(A00E(H 5A:;
girls.set9(A005(H U0:;
girls.set9(A00U(H **0:;
girls.set9(A00P(H +0:;
girls.set9(A00G(H *A0:;

model.add8eries9-oys:;
model.add8eries9girls:;
model.set!itle9(ategory hart(:;
model.set8how#oint7a-els9true:;
model.get<&es9:.put9<&is!ype.NH new ategory<&is9("ears(::;
y<&is.set7a-el9(=irths(:;
y<&is.set5in90:;
y<&is.set5a&9A00:;
0
pu-lic 7inehart5odel get5odel9: /
return model;
0
0
68
Area
pu-lic class =ean /
pu-lic =ean9: /

7inehart8eries -oys ' new 7inehart8eries9:;
-oys.set6ill9true:;
-oys.set9(A005(H *00:;

7inehart8eries girls ' new 7inehart8eries9:;
girls.set6ill9true:;
girls.set9(A00P(H +0:;

model.set!itle9(<rea hart(:;
model.set7egend#osition9(ne(:;
model.set8tac2ed9true:;
model.get<&is9<&is!ype.N:.set7a-el9("ears(:;
y<&is.set5in90:;
y<&is.set5a&9)00:;
0
pu-lic artesianhart5odel get5odel9: /
return model;
0
0
69
3.13.3 BarChart
1ar*hart8ode( i ued to created a 1ar*hart.
.asic
<p:chart type'(-ar( value'(./-ean.model0( />
pu-lic class =ean /
private =arhart5odel model;
pu-lic hart=ean9: /
model ' new =arhart5odel9:;

-oys.set9(A005(H *00:;

girls.set9(A00P(H *)5:;

model.set!itle9(=ar hart(:;

<&is &<&is ' model.get<&is9<&is!ype.N:;
&<&is.set7a-el9(Iender(:;

y<&is.set5in90:;
y<&is.set5a&9A00:;
0
pu-lic =arhart5odel get5odel9: / return model; 0
0
70
(ori9ontal and Stac+ed
pu-lic class =ean /
private 4oriOontal=arhart5odel model;
pu-lic hart=ean9: /
model ' new 4oriOontal=arhart5odel9:;

-oys.set9(A00E(H 50:;
-oys.set9(A005(H +U:;
-oys.set9(A00P(H 55:;

girls.set9(A00U(H GA:;
girls.set9(A00P(H )5:;


model.set!itle9(4oriOontal and 8tac2ed(:;
model.set8tac2ed9true:;

<&is &<&is ' model.get<&is9<&is!ype.N:;
&<&is.set7a-el9(=irths(:;
&<&is.set5in90:;
&<&is.set5a&9A00:;

y<&is.set7a-el9(Iender(:;
0
pu-lic 4oriOontal=arhart5odel get5odel9: / return model; 0
0
71
3.13.4 DonutChart
Donut*hart i ,enerated uin, Donut*hart8ode(.
.asic
<p:chart type'(donut( value'(./-ean.model0( />
pu-lic class =ean /
private Donuthart5odel model;
pu-lic hart=ean9: /
model ' new Donuthart5odel9:;

5ap<8tringH Jum-er> circle* ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circle*.put9(=rand *(H *50:;
circle*.put9(=rand A(H E00:;
circle*.put9(=rand )(H A00:;
circle*.put9(=rand E(H *0:;
model.addircle9circle*:;

5ap<8tringH Jum-er> circleA ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circleA.put9(=rand *(H 5E0:;
circleA.put9(=rand A(H *A5:;
circleA.put9(=rand )(H P0A:;
circleA.put9(=rand E(H EA*:;
model.addircle9circleA:;

5ap<8tringH Jum-er> circle) ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circle).put9(=rand *(H E0:;
circle).put9(=rand A(H )A5:;
circle).put9(=rand )(H E0A:;
circle).put9(=rand E(H EA*:;
model.addircle9circle):;
model.set!itle9(Donut hart(:;
0
pu-lic Donuthart5odel get5odel9: / return model; 0
0
72
$ustomi9ed
<p:chart type'(donut( value'(./-ean.model0( />
pu-lic class =ean /
private Donuthart5odel model;
pu-lic hart=ean9: /
model ' new Donuthart5odel9:;

5ap<8tringH Jum-er> circle* ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circle*.put9(=rand *(H *50:;
circle*.put9(=rand A(H E00:;
circle*.put9(=rand )(H A00:;
circle*.put9(=rand E(H *0:;
model.addircle9circle*:;

5ap<8tringH Jum-er> circleA ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circleA.put9(=rand *(H 5E0:;
circleA.put9(=rand A(H *A5:;
circleA.put9(=rand )(H P0A:;
circleA.put9(=rand E(H EA*:;
model.addircle9circleA:;

5ap<8tringH Jum-er> circle) ' new 7in2ed4ash5ap<8tringH Jum-er>9:;
circle).put9(=rand *(H E0:;
circle).put9(=rand A(H )A5:;
circle).put9(=rand )(H E0A:;
circle).put9(=rand E(H EA*:;
model.addircle9circle):;
model.set!itle9(Donut hart(:;
model.set!itle9(ustom Options(:;
model.set8lice5argin95:;
model.set8howData7a-els9true:;
model.setData6ormat9(value(:;
model.set8hadow9false:;
0
pu-lic Donuthart5odel get5odel9: / return model; 0
0
73
3.13.5 BubbleChart
1ubb(e*hart i created 'ith a 1ubb(e*hart8ode(.
.asic
<p:chart type'(-u--le( value'(./-ean.model0( />
pu-lic class =ean /
private =u--lehart5odel model;
pu-lic hart=ean9: /
model ' new =u--lehart5odel9:;
model.add9new =u--lehart8eries9(<cura(H P0H *G)H55::;
model.add9new =u--lehart8eries9(<lfa Comeo(H E5H +AH )U::;
model.add9new =u--lehart8eries9(<5 Ieneral(H AEH *0EH E0::;
model.add9new =u--lehart8eries9(=ugatti(H 50H *A)H U0::;
model.add9new =u--lehart8eries9(=51(H *5H G+H A5::;
model.add9new =u--lehart8eries9(<udi(H E0H *G0H G0::;
model.add9new =u--lehart8eries9(<ston 5artin(H P0H P0H EG::;
model.set!itle9(=u--le hart(:;
model.get<&is9<&is!ype.N:.set7a-el9(#rice(:;
y<&is.set5in90:;
y<&is.set5a&9A50:;
y<&is.set7a-el9(7a-els(:;
0
pu-lic =u--lehart5odel get5odel9: / return model; 0
0
74
$ustomi9ed
<p:chart type'(-u--le( value'(./-ean.model0( />
pu-lic class =ean /
private =u--lehart5odel model;
pu-lic hart=ean9: /
model ' new =u--lehart5odel9:;
model.add9new =u--lehart8eries9(<cura(H P0H *G)H55::;
model.add9new =u--lehart8eries9(<lfa Comeo(H E5H +AH )U::;
model.add9new =u--lehart8eries9(<5 Ieneral(H AEH *0EH E0::;
model.add9new =u--lehart8eries9(=ugatti(H 50H *A)H U0::;
model.add9new =u--lehart8eries9(=51(H *5H G+H A5::;
model.add9new =u--lehart8eries9(<udi(H E0H *G0H G0::;
model.add9new =u--lehart8eries9(<ston 5artin(H P0H P0H EG::;
model ' init=u--le5odel9:;
model.set8hadow9false:;
model.set=u--leIradients9true:;
model.set=u--le<lpha90.G:;
model.get<&is9<&is!ype.N:.set!ic2<ngle9350:;
y<&is.set5in90:;
y<&is.set5a&9A50:;
y<&is.set!ic2<ngle950:;
0
pu-lic =u--lehart5odel get5odel9: / return model; 0
0
75
3.13. !hlc Chart
7h(c*hart8ode( i ued to di&(ay 7h(c *hart.
.asic
<p:chart type'(ohlc( value'(./-ean.model0( />
pu-lic class =ean /
private Ohlchart5odel model;
pu-lic hart=ean9: /
ohlc5odel ' new Ohlchart5odel9:;

ohlc5odel.add9new Ohlchart8eries9A00PH *E).GAH *EE.5UH *)U.0EH *)U.+P::;
ohlc5odel.add9new Ohlchart8eries9A00GH *)G.PH *)+.UGH *)5.*GH *)5.E::;
ohlc5odel.add9new Ohlchart8eries9A00+H *E).EUH *EE.UUH *)+.P+H *E0.0A::;
ohlc5odel.add9new Ohlchart8eries9A0*0H *E0.UPH *E).5UH *)A.GGH *EA.EE::;
ohlc5odel.add9new Ohlchart8eries9A0**H *)U.0*H *)+.5H *)E.5)H *)+.EG::;
ohlc5odel.add9new Ohlchart8eries9A0*AH *AE.PUH *)5.+H *AE.55H *)5.G*::;
ohlc5odel.add9new Ohlchart8eries9A0*AH *A).P)H *A+.)*H *A*.5PH *AA.5::;

ohlc5odel.set!itle9(O47 hart(:;
ohlc5odel.get<&is9<&is!ype.N:.set7a-el9("ear(:;
ohlc5odel.get<&is9<&is!ype.":.set7a-el9(#rice hange VT/Knit(:;
0
pu-lic Ohlchart5odel get5odel9: / return model; 0
0
76
$andlestic+
<p:chart type'(ohlc( value'(./-ean.model0( />
pu-lic class =ean /
private Ohlchart5odel model;
pu-lic hart=ean9: /
model ' new Ohlchart5odel9:;

for9 int i'* ; i < E* ; i>>: /
ohlc5odelA.add9new Ohlchart8eries9iH 5ath.random9: W G0 > G0H
5ath.random9: W 50 > **0H 5ath.random9: W A0 > G0H 5ath.random9: W G0 > G0::;
0

model.set!itle9(andlestic2(:;
model.setandle8tic29true:;
model.get<&is9<&is!ype.N:.set7a-el9(8ector(:;
model.get<&is9<&is!ype.":.set7a-el9(Inde& @alue(:;
0
pu-lic Ohlchart5odel get5odel9: / return model; 0
0
77
3.13." #eter$au%e Chart
8eterGau,e *hart i created uin, 8eterGau,e*hart8ode(.
.asic
<p:chart type'(metergauge( value'(./-ean.model0( />
pu-lic class =ean /
private 5eterIaugehart5odel model;
pu-lic hart=ean9: /
7ist<Jum-er> intervals ' new <rray7ist<Jum-er>9://
add9A0:;
add950:;
add9*A0:;
add9AA0:;
00;
model ' new 5eterIaugehart5odel9*E0H intervals:;
model.set!itle9(5eterIauge hart(:;
model.setIauge7a-el9(2m/h(:;
0
pu-lic 5eterIaugehart5odel get5odel9: / return model; 0
0
$ustomi9ed
<p:chart type'(metergauge( value'(./-ean.model0( />
78
pu-lic class =ean /
private 5eterIaugehart5odel model;
pu-lic hart=ean9: /
7ist<Jum-er> intervals ' new <rray7ist<Jum-er>9://
add9A0:;
add950:;
add9*A0:;
add9AA0:;
00;
model ' new 5eterIaugehart5odel9*E0H intervals:;
model.set8eriesolors9(UUccUUH+)-P5fH$P$U5GHccUUUU(:;
model.setIauge7a-el9(2m/h(:;
model.setIauge7a-el#osition9(-ottom(:;
model.set8how!ic27a-els9false:;
model.set7a-el4eight<d,ust9**0:;
model.setIntervalOuterCadius9*)0:;
0
pu-lic 5eterIaugehart5odel get5odel9: / return model; 0
0
79
3.13.& Co'bined Chart
7n a"e ,ra&hE di++erent erie ty&e can be di&(ayed to,ether.
.asic
pu-lic class =ean /
private =arhart5odel model;
pu-lic hart=ean9: /
com-ined5odel ' new =arhart5odel9:;

=arhart8eries -oys ' new =arhart8eries9:;
-oys.set9(A005(H *00:;

girls.set9(A00P(H *)5:;

model.set!itle9(=ar and 7ine(:;
model.set5ouseover4ighlight9false:;
model.set8howDatatip9false:;
y<&is.set5in90:;
y<&is.set5a&9A00:;
0
pu-lic =arhart5odel get5odel9: / return model; 0
0
80
3.13.( #ultiple Axi)
U& to 9 a0e ?0a0iB09a0iE ya0iBy9a0i@ can be di&(ayed on the a"e chart.
.asic
pu-lic class =ean /
pu-lic hart=ean9: /

=arhart8eries -oys ' new =arhart8eries9:;
-oys.set9(A005(H *00:;

girls.setNa&is9<&is!ype.NA:;
girls.set"a&is9<&is!ype."A:;
girls.set9(<(H 5A:;
girls.set9(=(H U0:;
girls.set9((H **0:;
girls.set9(D(H *)5:;
girls.set9($(H *A0:;


model.set!itle9(5ulti <&is hart(:;
model.set5ouseover4ighlight9false:;

model.get<&es9:.put9<&is!ype.NH new ategory<&is9("ears(::;
model.get<&es9:.put9<&is!ype.NAH new ategory<&is9(#eriod(::;

y<&is.set7a-el9(=irth(:;
y<&is.set5in90:;
y<&is.set5a&9A00:;

<&is yA<&is ' new 7inear<&is9(Jum-er(:;
yA<&is.set5in90:;
yA<&is.set5a&9A00:;

model.get<&es9:.put9<&is!ype."AH yA<&is:;
0
pu-lic 7inehart5odel get5odel9: / return model; 0
0
81
82
3.13.1* Date Axi)
Ue DateA0i i+ you are di&(ayin, date in an a0i.
.asic
pu-lic class =ean /
pu-lic hart=ean9: /
date5odel ' new 7inehart5odel9:;
7inehart8eries series* ' new 7inehart8eries9:;
series*.set7a-el9(8eries *(:;
series*.set9(A0*E30*30*(H 5*:;
series*.set9(A0*E30*30U(H AA:;
series*.set9(A0*E30*3*A(H U5:;
series*.set9(A0*E30*3*G(H PE:;
series*.set9(A0*E30*3AE(H AE:;
series*.set9(A0*E30*3)0(H 5*:;

7inehart8eries seriesA ' new 7inehart8eries9:;
seriesA.set7a-el9(8eries A(:;
seriesA.set9(A0*E30*30*(H )A:;
seriesA.set9(A0*E30*30U(H P):;
seriesA.set9(A0*E30*3*A(H AE:;
seriesA.set9(A0*E30*3*G(H *A:;
seriesA.set9(A0*E30*3AE(H PE:;
seriesA.set9(A0*E30*3)0(H UA:;

date5odel.add8eries9series*:;
date5odel.add8eries9seriesA:;
date5odel.set!itle9(Xoom for Details(:;
date5odel.setXoom9true:;
date5odel.get<&is9<&is!ype.":.set7a-el9(@alues(:;
Date<&is a&is ' new Date<&is9(Dates(:;
a&is.set!ic2<ngle9350:;
a&is.set5a&9(A0*E30A30*(:;
a&is.set!ic26ormat9(F- F.dH Fy(:;

date5odel.get<&es9:.put9<&is!ype.NH a&is:;
0
pu-lic 7inehart5odel get5odel9: / return model; 0
0
83
3.13.11 +nteracti,e Chart
*hart are interactive co"&onentE in+or"ation about e(ected erie and ite" can be &aed via
a/a0 to a AS# bac3in, bean uin, Ite"Se(ectEvent.
.asic
<p:chart type'(pie( value'(./-ean.model0(>
<p:a,a& event'(item8elect( listener'(./-ean.item8elect0( />
</p:chart>
pu-lic class =ean /
pu-lic hart=ean9: /


model.set!itle9(8imple #ie(:;
0
pu-lic #iehart5odel get5odel9: / return model; 0
pu-lic void item8elect9Item8elect$vent event: /
6aces5essage msg ' new 6aces5essage96aces5essage.8$@$CI!"LIJ6OH
(Item selected(H (Item Inde&: ( > event.getItemInde&9: >
(H 8eries Inde&:( > event.get8eriesInde&9::;

6acesonte&t.geturrentInstance9:.add5essage9nullH msg:;
0
0
84
3.13.12 Export
*hart co"&onent &rovide a c(ient ide "ethod to convert the ,ra&h to an i"a,e. E0a"&(e be(o'
de"ontrate ho' to ue a button c(ic3 to e0&ort the chart a an i"a,e and di&(ay it in a dia(o, o
that uer can do'n(oad it a a re,u(ar i"a,e.
<p:chart type'(line( value'(./-ean.model0( style'(width:500p&;height:)00p&(
widget@ar'(chart(/>

<p:command=utton type'(-utton( value'($&port( icon'(ui3icon3e&tlin2(
onclic2'(e&porthart9:(/>

<p:dialog widget@ar'(dlg( show$ffect'(fade( modal'(true( header'(hart as an Image(>
<p:output#anel id'(output( layout'(-loc2( style'(width:500p&;height:)00p&(/>
</p:dialog>

function e&porthart9: /
//e&port image
V9?.output?:.empty9:.append9#69?chart?:.e&port<sImage9::;

//show the dialog
#69?dlg?:.show9:;
0
85
3.13.13 -tatic +'a%e)
A#ree*hart 'ith Gra&hicI"a,e co"&onent i an a(ternative to the chart co"&onent.
.asic
<p:graphicImage value'(./-ean.chart0( />
pu-lic class =ean /
private 8treamedontent chart;
pu-lic =ean9: /
Y6reehart ,freechart ' hart6actory.create#iehart9(ities(H
createDataset9:H trueH trueH false:;
6ile chart6ile ' new 6ile9(dynamichart(:;
hartKtilities.savehart<s#JI9chart6ileH ,freechartH )P5H )00:;
chart ' new Default8treamedontent9new 6ileInput8tream9chart6ile:H
(image/png(:;
0
pu-lic 8treamedontent gethart9: / return model; 0
private #ieDataset createDataset9: /
Default#ieDataset dataset ' new Default#ieDataset9:;
dataset.set@alue9(Jew "or2(H new Dou-le9E5.0::;
dataset.set@alue9(7ondon(H new Dou-le9*5.0::;
dataset.set@alue9(#aris(H new Dou-le9A5.A::;
dataset.set@alue9(=erlin(H new Dou-le9*E.G::;

return dataset;
0
0
86
3.13.14 -.innin%
*hart can be ty(ed uin, re,u(ar c. #o((o'in, i the (it o+ ty(e c(aeK
)tyle #lass Applies
./C&(otBtar,et !(ot tar,et container.
./C&(otBa0i A0e.
./C&(otB0a0i !ri"ary 0Ba0i.
./C&(otBya0i !ri"ary yBa0i.
./C&(otB0%a0iE ./C&(otB0)a0i ... %ndE )rd ... 0Ba0i.
./C&(otBy%a0iE ./C&(otBy)a0i ... %ndE )rd ... yBa0i.
./C&(otBa0iBtic3 A0i tic3.
./C&(otB0a0iBtic3 !ri"ary 0Ba0i tic3.
./C&(otB0%a0iBtic3 Secondary 0Ba0i tic3.
./C&(otBya0iBtic3 !ri"ary yBa0iBtic3.
./C&(otBy%a0iBtic3 Seconday yBa0iBtic3.
tab(e./C&(otBtab(eB(e,end 6e,end tab(e.
./C&(otBtit(e 9it(e o+ the chart.
./C&(otBcurorBtoo(ti& *uror too(ti&.
./C&(otBhi,h(i,hterBtoo(ti& .i,h(i,hter too(ti&.
div./C&(otBtab(eB(e,endB'atch *o(or 'atch o+ the (e,end.
Additiona((y style and styleClass o&tion o+ chart co"&onent a&&(y to the container e(e"ent o+
chartE ue thee attribute to &eci+y the di"enion o+ a chart.
<p:piehart value'(./-ean.model0( style'width:)A0p&;height:A00p& />
In cae youd (i3e to chan,e the co(or o+ erieE ue the seriesColors o&tion in *hart8ode( A!I.
87
3.13.15 Extender
*hart A!I &rovide hi,h (eve( acce to co""on(y ued /C&(ot o&tion ho'ever there are "any "ore
cuto"i=ation o&tion avai(ab(e in /C&(ot. E0tender +eature &rovide acce to (o' (eve( a&i to do
advanced cuto"i=ation by enhancin, the con+i,uration ob/ectE here i an e0a"&(e to increae
hado' de&th o+ the (ine erie 'here "ode(O e0tender &ro&erty i et to Ie0tI.
function e&t9: /
//this ' chart widget instance
//this.cfg ' options
this.cfg.seriesDefaults ' /
shadowDepth: 5
0;
0
Re+er to /C!(ot doc +or avai(ab(e o&tion.
88
3.13.1 Chart AP+
A-is
org.primefaces.model.chart.A$is
Property Default Type Description
(abe( nu(( Strin, 9it(e o+ the a0i.
"in nu(( 7b/ect 8ini"u" boundary va(ue.
"a0 nu(( 7b/ect 8a0i"u" boundary va(ue.
tic3An,(e nu(( Inte,er An,(e o+ te0tE "eaured c(oc3'ie.
tic3#or"at nu(( Strin, #or"at trin, to ue 'ith the a0i tic3 +or"atter
tic3Interva( nu(( Strin, <u"ber o+ unit bet'een tic3.
tic3*ount nu(( Inte,er Deired nu"ber o+ tic3.
A-is1ype
org.primefaces.model.chart.A$isType
A0i9y&e i an enu" to de+ine the ty&e o+ the a0i +ro" FBM to F9BM9.
.ar$hartModel
org.primefaces.model.chart.)arChart-odel e0tend org.primefaces.model.chart.Chart-odel
bar!addin, 2 Inte,er !addin, bet'een bar.
bar8ar,in 10 Inte,er 8ar,in bet'een bar.
tac3ed +a(e 1oo(ean Di&(ay erie in tac3ed +or"at.
.ar$hartSeries
org.primefaces.model.chart.)arChartSeries e0tend org.primefaces.model.chart.ChartSeries
diab(eStac3 +a(e 1oo(ean When trueE erie data i not inc(uded in a tac3ed chart.
.ubble$hartModel
org.primefaces.model.chart.)ubbleChart-odel e0tend org.primefaces.model.chart.Chart-odel
data nu(( 6itS1ubb(e*hartSerieT Data a a (it o+ 1ubb(e*hartSerie.
bubb(eGradient +a(e 1oo(ean Di&(ay bubb(e 'ith ,radient.
bubb(eA(&ha 1.0 Doub(e 7&acity o+ bubb(e.
ho'6abe( true 1oo(ean Di&(ay (abe( o+ a erie inide a bubb(e.
89
.ubble$hartSeries
org.primefaces.model.chart.)arChartSeries e0tend org.primefaces.model.chart.ChartSeries
0 nu(( Inte,er FBA0i va(ue o+ the bubb(e.
y nu(( Inte,er MBA0i va(ue o+ the bubb(e.
radiu nu(( Inte,er Radiu o+ the bubb(e.
(abe( nu(( Strin, 6abe( te0t o+ the bubb(e.
$artesian$hartModel
org.primefaces.model.chart.CartesianChart-odel
erie nu(( 6itS*hartSerieT 6it o+ erie.
a0e .ah8a& 8a&SA0i9y&eEA0iT 8a& o+ chart a0i.
=oo" +a(e 1oo(ean Add =oo" +eature 'hen enab(ed.
ani"ate +a(e 1oo(ean When enab(edE erie are dra'n 'ith an e++ect.
ho'Datati& true 1oo(ean Di&(ay a too(ti& on hover.
datati&#or"at nu(( Strin, #or"at o+ the data too(ti&.
ho'!oint6abe( +a(e 1oo(ean Di&(ay data in(ine in &(ot.
$ate&oryA-is
org.primefaces.model.chart.CategoryA$is e0tend org.primefaces.model.chart.A$is
*ate,oryA0i i ued 'hen data on the a0i doe not conit o+ nu"ber.
$hartModel
org.primefaces.model.chart.Chart-odel
tit(e nu(( Strin, 9it(e te0t +or the &(ot
hado' true 1oo(ean 9o ho' hado' or not on erie.
erie*o(or nu(( Strin, *o""a e&arated (it o+ erie co(or e.,. IX-11%*5IE
I*****I
(e,end!oition nu(( Strin, !oition o+ the (e,end (i3e InI or IneI.
(e,end*o( 0 Inte,er 8a0i"u" nu"ber o+ co(u"n in the (e,end.
(e,endRo' 0 Inte,er 8a0i"u" nu"ber o+ ro' in the (e,end.
"oueover.i,h(i,ht true 1oo(ean .i,h(i,ht erie on hover.
e0tender nu(( Strin, <a"e o+ /avacri&t +unction to e0tend chart 'ith.
$hartSeries
org.primefaces.model.chart.ChartSeries
(abe( nu(( Strin, 9it(e te0t o+ the erie.
90
data nu(( 8a&S7b/ectE<u"berT Data o+ the erie a a "a&.
0a0i nu(( A0i9y&e FBA0i o+ the erie.
ya0i nu(( A0i9y&e MBA0i o+ the erie.
DateA-is
org.primefaces.model.chart.'ateA$is e0tend org.primefaces.model.chart.A$is
DateA0i i ued 'hen data on the a0i conit o+ trin, re&reentation o+ date va(ue.
Donut$hartModel
org.primefaces.model.chart.'onutChart-odel e0tend org.primefaces.model.chart.Chart-odel
data nu(( 6itT8a&SStrin,E7b/ectTT Data a a (it o+ "a& intance.
(ice8ar,in 0 Inte,er An,u(ar &acin, bet'een &ie (ice in de,ree.
+i(( true 1oo(ean 9rue or #a(e to +i(( the (ice.
ho'Data6abe( +a(e 1oo(ean 9rue to #a(e ho' data (abe( on (ice.
data#or"at &ercent Strin, Either Y(abe(ZE Yva(ueZE Y&ercentZ or an array o+
(abe( to &(ace on the &ie (ice.
(ori9ontal.ar$hartModel
org.primefaces.model.chart..ori/ontal)arChart-odel e0tend
org.primefaces.model.chart.)arChart-odel
.ori=onta(1ar*hart8ode( i an e0tenion to 1ar*hart8ode( 'ith yBa0i ued +or the cate,orie and
0Ba0i +or the data va(ue.
*ine$hartSeries
org.primefaces.model.chart.&ineChartSeries e0tend org.primefaces.model.chart.ChartSeries
"ar3erSty(e +i((ed*irc(e Strin, Sty(e o+ the "ar3erE va(id va(ue are diamondE circleE squareE
$E plusE dashE filled'iamondE filledCircleE filledSquare.
ho'6ine true 1oo(ean Whether to actua((y dra' the (ine or not.
ho'8ar3er true 1oo(ean Di&(ay "ar3e at data &oint.
+i(( +a(e 1oo(ean #i(( the area bet'een (ine.
+i((A(&ha 1 Doub(e 7&acity o+ the +i((ed area.
diab(eStac3 +a(e 1oo(ean When trueE erie data i not inc(uded in a tac3ed chart.
*inearA-is
org.primefaces.model.chart.&inearA$is e0tend org.primefaces.model.chart.A$is
6inearA0i i the A0i i"&(e"entation ued to di&(ay nu"ber.
*ine$hartModel
org.primefaces.model.chart.&ineChart-odel e0tend
org.primefaces.model.chart.CartesianChart-odel
91
tac3ed nu(( 6itS*hartSerieT Di&(ay erie in tac3ed +or"at.
brea37n<u(( .ah8a& 8a&SA0i9y&eEA0iT Dicontinue (ine &(ot +or nu(( va(ue.
Meter)au&e$hartModel
org.primefaces.model.chart.-eter0augeChart-odel e0tend
org.primefaces.model.chart.Chart-odel
va(ue nu(( <u"ber >a(ue o+ the ,au,e.
interva( nu(( 6itS<u"berT 6it o+ ran,e to be dra'n around the ,au,e.
tic3 0 6itS<u"berT 6it o+ tic3 va(ue.
,au,e6abe( true Strin, 6abe( te0t o+ the ,au,e.
,au,e6abe(!oition +a(e Strin, Where to &oition the (abe(E either YinideZ or Ybotto"Z.
"in nu(( Doub(e 8ini"u" va(ue on the ,au,e.
"a0 nu(( Doub(e 8ini"u" va(ue on the ,au,e.
ho'9ic36abe( true 1oo(ean Di&(ay tic3 (abe( ne0t to tic3.
interva(7uterRadiu 25 Inte,er Radiu o+ the outer circ(e o+ the interva( rin,.
(abe(.ei,htAd/ut B%5 Inte,er <u"ber o+ !i0e( to o++et the (abe( u& ?B@ or do'n ?H@
+ro" it de+au(t &oition.
;hlc$hartModel
org.primefaces.model.chart.,hlcChart-odel e0tend org.primefaces.model.chart.Chart-odel
data nu(( 6itS7h(c*hartSerieT Data a a (it o+ 7h(*hartSerie.
cand(eStic3 +a(e 1oo(ean Di&(ay erie a cand(etic3.
;hlc$hartSeries
org.primefaces.model.chart.,hlcChartSeries e0tend org.primefaces.model.chart.ChartSeries
va(ue nu(( 6itS7h(c*hartSerieT Data a a (it o+ 7h(*hartSerie.
o&en nu(( Doub(e 7&en va(ue.
hi,h nu(( Doub(e .i,h va(ue.
(o' nu(( Doub(e 6o' va(ue.
c(oe nu(( Doub(e *(oe va(ue.
Pie$hartModel
org.primefaces.model.chart.PieChart-odel e0tend org.primefaces.model.chart.Chart-odel
data nu(( 8a&SStrin,E7b/ectT Data a a 8a& intance.
dia"eter nu(( Inte,er 7uter dia"eter o+ the &ieE auto co"&uted by de+au(t
92
(ice8ar,in 0 Inte,er An,u(ar &acin, bet'een &ie (ice in de,ree.
+i(( true 1oo(ean 9rue or #a(e to +i(( the (ice.
ho'Data6abe( +a(e 1oo(ean 9rue to #a(e ho' data (abe( on (ice.
data#or"at &ercent Strin, Either Y(abe(ZE Yva(ueZE Y&ercentZ or an array o+ (abe(
to &(ace on the &ie (ice.
93
#.1' $loc+
*(oc3 di&(ay erver or c(ient dateti"e (ive.

In%o
9a, cloc,
*o"&onent *(a org.primefaces.component.cloc,.#loc,
*o"&onent 9y&e org.primefaces.component.#loc,
Renderer 9y&e org.primefaces.component.#loc,enderer
Renderer *(a org.primefaces.component.cloc,.#loc,enderer
Attributes
rendered.
&attern nu(( Strin, Dateti"e +or"at.
"ode c(ient Strin, 8ode va(ueE va(id va(ue are c(ient and erver.
autoSync +a(e 1oo(ean Sync ti"e &eriodica((y in erver "ode.
yncInterva( 40000 Inte,er De+ine the ync in " interva( in autoSync ettin,.
)ettin& Started with $loc+
*(oc3 ha t'o "odeE client ?de+au(t@ and server. In i"&(e "odeE dateti"e i di&(ayed by /ut
addin, co"&onent on &a,e. 7n &a,e (oadE c(oc3 i initia(i=ed and tart runnin, baed on c(ient ti"e.
<p:cloc2 />
94
Serer Mode
In erver "odeE c(oc3 initia(i=ed ite(+ 'ith the erver dateti"e and tart runnin, on c(ient ide.
9o "a3e ure c(ient c(oc3 and erver c(oc3 i yncedE you can enab(e autoSync o&tion that "a3e an
a/a0 ca(( to the erver &eriodica((y to re+reh the erver ti"e 'ith c(ient.
Date1ime Format
Dateti"e +or"at ued can be chan,ed uin, &attern attribute.
<p:cloc2 pattern'(44:mm:ss dd.55.yyyy( />
S+innin&
*(oc3 reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i the (it
o+ tructura( ty(e c(aeK
)tyle #lass Applies
.uiBc(oc3 *ontainer e(e"ent.
95
3.15 Collector
*o((ector i a i"&(e uti(ity to "ana,e co((ection dec(arative(y.
In%o
9a, collector
Action6itener *(a org.primefaces.component.collector.#ollector
Attributes
va(ue nu(( 7b/ect >a(ue to be ued in co((ection o&eration
add9o nu(( /ava.uti(.*o((ection Re+erence to the *o((ection intance
re"ove#ro" nu(( /ava.uti(.*o((ection Re+erence to the *o((ection intance
uniCue true 1oo(ean When enab(edE re/ect du&(icate ite" on addition.
)ettin& started with $ollector
*o((ector reCuire a co((ection and a va(ue to 'or3 'ith. It i"&ortant to override eCua( and
hah*ode "ethod o+ the va(ue ob/ect to "a3e co((ector 'or3.
pu-lic class =oo2=ean /
private =oo2 -oo2 ' new =oo29:;
private 7ist<=oo2> -oo2s;
pu-lic reate=oo2=ean9: /
-oo2s ' new <rray7ist<=oo2>9:;
0
0
<p:command=utton value'(<dd(>
<p:collector value'(./-oo2=ean.-oo20( add!o'(./-oo2=ean.-oo2s0( />
</p:command=utton>
<p:command7in2 value'(Cemove(>
<p value'(./-oo20( remove6rom'(./create=oo2=ean.-oo2s0( />
</p:command7in2>
96
#.15 $olor Pic+er
*o(or!ic3er i an in&ut co"&onent 'ith a co(or &a(ette.

In%o
9a, colorPic,er
*o"&onent *(a org.primefaces.component.colorpic,er.#olorPic,er
*o"&onent 9y&e org.primefaces.component.#olorPic,er
Renderer 9y&e org.primefaces.component.#olorPic,erenderer
Renderer *(a org.primefaces.component.colorpic,er.#olorPic,erenderer
Attributes
be rendered.
va(ue nu(( 7b/ect >a(ue o+ the co"&onent.
converter nu(( *onverterQStr
in,
co"&onent.
va(idator nu(( 8ethodE0&r A "ethod e0&reion that re+er to a "ethod +or
va(idation the in&ut.
97
va(ue*han,e6itener nu(( >a(ue*han,e
6itener
"ethod +or hand(in, a va(uchan,eevent.
va(idation +ai(.
"ode &o&u& Strin, Di&(ay "odeE va(id va(ue are &o&u& and
in(ine.
)ettin& started with $olorPic+er
*o(or!ic3er va(ue hou(d be a he0 trin,.
pu-lic class =ean /
pu-lic 8tring getolor9: /
return this.color;
0
pu-lic void setolor98tring color: /
this.color ' color;
0
0
<p:color#ic2er value'(./-ean.color0( />
Display Mode
*o(or!ic3er ha t'o "odeE de+au(t "ode i popup and other avai(ab(e o&tion i inline.
<p:color#ic2er value'(./-ean.color0( mode'(inline(/>
98
S+innin&
*o(or!ic3er reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i
)tyle #lass Applies
.uiBco(or&ic3er *ontainer e(e"ent.
.uiBco(or&ic3erLco(or 1ac3,round o+ ,radient.
.uiBco(or&ic3erLhue .ue e(e"ent.
.uiBco(or&ic3erLne'Lco(or <e' co(or di&(ay.
.uiBco(or&ic3erLcurrentLco(or *urrent co(or di&(ay.
.uiBco(or&ic3erBr,bBr Red in&ut.
.uiBco(or&ic3erBr,bB, Greed in&ut.
.uiBco(or&ic3erBr,bBb 1(ue in&ut.
.uiBco(or&ic3erBr,bBh .ue in&ut.
.uiBco(or&ic3erBr,bB Saturation in&ut.
.uiBco(or&ic3erBr,bBb 1ri,htne in&ut.
.uiBco(or&ic3erBr,bBhe0 .e0 in&ut.
99
#.16 $olumn
*o(u"n i an e0tended verion o+ the tandard co(u"n ued by variou co"&onent (i3e datatab(eE
treetab(e and "ore.

In%o
9a, column
*o"&onent *(a org.primefaces.component.column.#olumn
*o"&onent 9y&e org.primefaces.component.#olumn
Attributes
ty(e nu(( Strin, In(ine ty(e o+ the co(u"n.
ty(e*(a nu(( Strin, Sty(e c(a o+ the co(u"n.
ort1y nu(( >a(ueE0&r >a(ueE0&reion to be ued +or ortin,.
ort#unction nu(( 8ethodE0&r *uto" &(u,,ab(e ort#unction.
+i(ter1y nu(( >a(ueE0&r >a(ueE0&reion to be ued +or +i(terin,.
+i(terSty(e nu(( Strin, In(ine ty(e o+ the +i(ter e(e"ent
+i(terSty(e*(a nu(( Strin, Sty(e c(a o+ the +i(ter e(e"ent
+i(ter7&tion nu(( 7b/ect A co((ection o+ e(ectite" +or +i(ter dro&do'n.
+i(ter8atch8ode tartWith Strin, 8atch "ode +or +i(terin,.
ro'&an 1 Inte,er De+ine the nu"ber o+ ro' the co(u"n &an.
co(&an 1 Inte,er De+ine the nu"ber o+ co(u"n the co(u"n &an.
header9e0t nu(( Strin, Shortcut +or header +acet.
+ooter9e0t nu(( Strin, Shortcut +or +ooter +acet.
e(ection8ode nu(( Strin, Enab(e e(ection "ode.
diab(edSe(ection +a(e 1oo(ean Diab(e ro' e(ection.
100
+i(ter8a06en,th nu(( Inte,er 8a0i"u" nu"ber o+ character +or an in&ut +i(ter.
rei=ab(e true 1oo(ean S&eci+ie rei=ab(e +eature at co(u"n (eve(. Datatab(eO
rei=ab(e*o(u"n "ut be enab(ed to ue thi o&tion.
'idth nu(( Strin, Width in &i0e( or &ercenta,e.
e0&ortab(e true 1oo(ean De+ine i+ the co(u"n hou(d be e0&orted by
datae0&orter.
+i(ter>a(ue nu(( 7b/ect >a(ue o+ the +i(ter +ie(d.
to,,(eab(e true 1oo(ean De+ine i+ &ane( i to,,(eab(e by co(u"n9o,,(er
co"&onent. De+au(t va(ue i true and a +a(e va(ue "ar3
the co(u"n a tatic.
+i(ter#unction nu(( 8ethodE0&r *uto" i"&(e"entation to +i(ter a va(ue a,aint a
contraint.
+ie(d nu(( Strin, <a"e o+ the +ie(d to &a (a=y (oad "ethod +or +i(terin,
and ortin,. I+ not &eci+iedE +i(ter1yBort1y va(ue are
ued to identi+y the +ie(d na"e.
)ettin& Started with $olumn
A co(u"n i a reued co"&onentE ee docu"entation o+ co"&onent that ue a co(u"n.
0ote
<ot a(( attribute o+ co(u"n are i"&(e"ented by the co"&onent that uti(i=e co(u"n.
101
#.17 $olumns
*o(u"n i ued by datatab(e to create co(u"n dyna"ica((y.

In%o
9a, columns
*o"&onent *(a org.primefaces.component.column.#olumns
*o"&onent 9y&e org.primefaces.component.#olumns
Attributes
rendered.
va(ue nu(( 7b/ect Data to re&reent co(u"n.
var nu(( Strin, <a"e o+ iterator to acce a co(u"n.
ty(e nu(( Strin, In(ine ty(e o+ the co(u"n.
ty(e*(a nu(( Strin, Sty(e c(a o+ the co(u"n.
ort1y nu(( >a(ueE0&r >a(ueE0&reion to be ued +or ortin,.
ort#unction nu(( 8ethodE0&r *uto" &(u,,ab(e ort#unction.
+i(ter1y nu(( >a(ueE0&r >a(ueE0&reion to be ued +or +i(terin,.
+i(terSty(e nu(( Strin, In(ine ty(e o+ the +i(ter e(e"ent
+i(terSty(e*(a nu(( Strin, Sty(e c(a o+ the +i(ter e(e"ent
+i(ter7&tion nu(( 7b/ect A co((ection o+ e(ectite" +or +i(ter dro&do'n.
+i(ter8atch8ode tartWith Strin, 8atch "ode +or +i(terin,.
ro'&an 1 Inte,er De+ine the nu"ber o+ ro' the co(u"n &an.
co(&an 1 Inte,er De+ine the nu"ber o+ co(u"n the co(u"n &an.
header9e0t nu(( Strin, Shortcut +or header +acet.
102
+ooter9e0t nu(( Strin, Shortcut +or +ooter +acet.
+i(ter8a06en,th nu(( Inte,er 8a0i"u" nu"ber o+ character +or an in&ut +i(ter.
rei=ab(e true 1oo(ean S&eci+ie rei=ab(e +eature at co(u"n (eve(. Datatab(eO
rei=ab(e*o(u"n "ut be enab(ed to ue thi o&tion.
'idth nu(( Strin, Width in &i0e( or &ercenta,e.
e0&ortab(e true 1oo(ean De+ine i+ the co(u"n hou(d be e0&orted by
datae0&orter.
co(u"nInde0>ar nu(( Strin, <a"e o+ iterator to re+er each inde0.
+i(ter>a(ue nu(( 7b/ect >a(ue o+ the +i(ter +ie(d.
to,,(eab(e true 1oo(ean De+ine i+ &ane( i to,,(eab(e by co(u"n9o,,(er
co"&onent. De+au(t va(ue i true and a +a(e va(ue "ar3
the co(u"n a tatic.
+i(ter#unction nu(( 8ethodE0&r *uto" i"&(e"entation to +i(ter a va(ue a,aint a
contraint.
+ie(d nu(( Strin, <a"e o+ the +ie(d to &a (a=y (oad "ethod +or +i(terin,
and ortin,. I+ not &eci+iedE +i(ter1yBort1y va(ue are
ued to identi+y the +ie(d na"e.
)ettin& Started with $olumns
See dyna"ic co(u"n ection in datatab(e docu"entation +or detai(ed in+or"ation.
103
#.18 $olumn)roup
*o(u"nGrou& i ued by datatab(e +or co(u"n ,rou&in,.

In%o
9a, column/roup
*o"&onent *(a org.primefaces.component.columngroup.#olumn/roup
*o"&onent 9y&e org.primefaces.component. #olumn/roup
Attributes
rendered.
ty&e nu(( Strin, 9y&e o+ ,rou&E va(id va(ue are header and +ooter.
)ettin& Started with $olumn)roup
See ,rou&in, ection in datatab(e docu"entation +or detai(ed in+or"ation.
104
#.2: $ommand.utton
*o""and1utton i an e0tended verion o+ tandard co""and1utton 'ith a/a0 and the"in,.

In%o
9a, command%utton
*o"&onent *(a org.primefaces.component.command&utton.#ommand%utton
*o"&onent 9y&e org.primefaces.component.#ommand%utton
Renderer 9y&e org.primefaces.component.#ommand%uttonenderer
Renderer *(a org.primefaces.component.command&utton.#ommand%uttonenderer
Attributes
intance in a bac3in, bean
va(ue nu(( Strin, 6abe( +or the button
action nu(( 8ethodE0&rQ
Strin,
A "ethod e0&reion or a Strin, outco"e thatd be
&roceed 'hen button i c(ic3ed.
action6itener nu(( 8ethodE0&r An action(itener thatd be &roceed 'hen button i
c(ic3ed.
i""ediate +a(e 1oo(ean 1oo(ean va(ue that deter"ine the &haeIdE 'hen true
action are &roceed at a&&(yLreCuetLva(ueE 'hen
+a(e at invo3eLa&&(ication &hae.
ty&e ub"it Strin, Set the behavior o+ the button.
a/a0 true 1oo(ean S&eci+ie the ub"it "odeE 'hen et to true?de+au(t@E
ub"it 'ou(d be "ade 'ith A/a0.
&roce nu(( Strin, *o"&onent?@ to &roce &artia((y intead o+ 'ho(e vie'.
u&date nu(( Strin, *o"&onent?@ to be u&dated 'ith a/a0.
105
ontart nu(( Strin, *(ient ide ca((bac3 to e0ecute be+ore a/a0 reCuet i
be,in.
onco"&(ete nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a/a0 reCuet i
co"&(eted.
onucce nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a/a0 reCuet
ucceed.
onerror nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a/a0 reCuet +ai(.
ty(e nu(( Strin, In(ine ty(e o+ the button e(e"ent.
ty(e*(a nu(( Strin, Sty(e*(a o+ the button e(e"ent.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button (oe +ocu
and it va(ue ha been "odi+ied ince ,ainin, +ocu.
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button receive
+ocu.
on3eydo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i &reed
do'n over button.
on3eyu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i re(eaed
over button.
106
"oved 'ithin button.
"oved onto button.
one(ect nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen te0t 'ithin button i
e(ected by uer.
button.
a(t nu(( Strin, A(ternate te0tua( decri&tion o+ the button.
diab(ed +a(e 1oo(ean Diab(e the button.
tabinde0 nu(( Inte,er !oition o+ the button e(e"ent in the tabbin, order.
tit(e nu(( Strin, Adviory too(ti& in+or"ation.
readon(y +a(e 1oo(ean #(a, indicatin, that thi co"&onent 'i(( &revent chan,e
by the uer.
icon nu(( Strin, Icon o+ the button a a c c(a.
icon!o (e+t Strin, !oition o+ the icon.
in(ine +a(e Strin, Ued by !ri"e#ace "obi(e on(y.
eca&e true 1oo(ean De+ine 'hether (abe( 'ou(d be eca&ed or not.
)ettin& started with $ommand.utton
*o""and1utton ua,e i i"i(ar to tandard co""and1uttonE by de+au(t co""and1utton ub"it
it enc(oin, +or" 'ith a/a0.
107
<p:command=utton value'(8ave( action7istener'(./-oo2=ean.save=oo20( />
pu-lic void save=oo29: /
//8ave -oo2
0
0
"eset .uttons
Reet button do not ub"it the +or"E /ut reet the +or" content.
<p:command=utton type'(reset( value'(Ceset( />
Push .uttons
!uh button are ued to e0ecute cuto" /avacri&t 'ithout cauin, an a/a0QnonBa/a0 reCuet. 9o
create a &uh button et ty&e a IbuttonI.
<p:command=utton type'(-utton( value'(<lert( onclic2'(alert9!#rime:( />
A!A= and 0on>A!A=
*o""and1utton ha bui(tBin a/a0 ca&abi(itieE a/a0 ub"it i enab(ed by de+au(t and con+i,ured
uin, a#a$ attribute. When a/a0 attribute i et to +a(eE +or" i ub"itted 'ith a re,u(ar +u(( &a,e
re+reh.
9he update attribute i ued to &artia((y u&date other co"&onent?@ a+ter the a/a0 re&one i
received. U&date attribute ta3e a co""a or 'hiteB&ace e&arated (it o+ AS# co"&onent id to be
u&dated. 1aica((y any AS# co"&onentE not /ut !ri"e#ace co"&onent hou(d be u&dated 'ith the
A/a0 re&one. In the +o((o'in, e0a"&(eE +or" i ub"itted 'ith a/a0 and display out&ut9e0t i
u&dated 'ith the a/a0 re&one.
<h:form>
<h:input!e&t value'(./-ean.te&t0( />
<p:command=utton value'(8u-mit( update'(display(/>
<h:output!e&t value'(./-ean.te&t0( id'(display( />
</h:form>
!ip: "ou can use the a,a&8tatus component to notify users a-out the a,a& reBuest.
108
Icons
An icon on a button i &rovided uin, icon o&tion. icon!o i ued to de+ine the &oition o+ the
button 'hich can be (e+t or ri,ht.
<p:command=utton value'(1ith Icon( icon'(dis2(/>
<p:command=utton icon'(dis2(/>
.di3 i a i"&(e c c(a 'ith a bac3,round &ro&ertyK
.dis2 /
-ac2ground3image: url9!dis2.png: !important;
0
Mou can a(o ue the &reBde+ined icon +ro" 9he"eRo((er (i3e ui1icon1search.
$lient Side API
Wid,etN PrimeFaces.widget.Command)utton
diab(e?@ B void Diab(e button
enab(e?@ B void Enab(e button
S+innin&
*o""and1utton render a button ta, 'hich style and styleClass a&&(ie. #o((o'in, i the (it o+
tructura( ty(e c(aeK
)tyle #lass Applies
109
#.21 $ommand*in+
*o""and6in3 e0tend tandard AS# co""and6in3 'ith A/a0 ca&abi(itie.
In%o
9a, command*in,
*o"&onent *(a org.primefaces.component.commandlin,.#ommand*in,
*o"&onent 9y&e org.primefaces.component.#ommand*in,
Renderer 9y&e org.primefaces.component.#ommand*in,enderer
Renderer *(a org.primefaces.component. commandlin,.#ommand*in,enderer
Attributes
rendered.
va(ue nu(( Strin, .re+ va(ue o+ the rendered anchor.
Strin,
&roceed 'hen (in3 i c(ic3ed.
action6itener nu(( 8ethodE0&r An action(itener thatd be &roceed 'hen (in3 i
c(ic3ed.
&roce nu(( Strin, *o"&onent?@ to &roce &artia((y intead o+ 'ho(e
vie'.
be,in.
110
co"&(eted.
ucceed.
reCuet are dicarded. I+ thi o&tion i not &eci+iedE or
i+ the va(ue o+ delay i the (itera( trin, OnoneO 'ithout
the CuoteE no de(ay i ued.
i,noreAutoU&date +a(e 1oo(ean I+ trueE co"&onent 'hich autoU&datePItrueI 'i(( not
be u&dated +or thi reCuet. I+ not &eci+iedE or the va(ue
i +a(eE no uch indication i "ade.
ty(e nu(( Strin, Sty(e to be a&&(ied on the anchor e(e"ent
ty(e*(a nu(( Strin, Sty(e*(a to be a&&(ied on the anchor e(e"ent
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (in3 (oe +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (in3 i c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (in3 i doub(e
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (in3 receive +ocu.
do'n over (in3.
on3ey&re nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a 3ey i &reed
and re(eaed over (in3.
over (in3.
&reed do'n over (in3.
"oved 'ithin (in3.
"oved a'ay +ro" (in3.
111
"oved onto (in3.
re(eaed over (in3.
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to the (in3.
charet nu(( Strin, *haracter encodin, o+ the reource dei,nated by thi
hy&er(in3.
coord nu(( Strin, !oition and ha&e o+ the hot &ot on the creen +or
c(ient ue in i"a,e "a&.
diab(ed nu(( 1oo(ean Diab(e the (in3
hre+(an, nu(( Strin, 6an,uae code o+ the reource dei,nated by the (in3.
re( nu(( Strin, Re(ationhi& +ro" the current docu"ent to the anchor
&eci+ied by the (in3E va(ue are &rovided by a &aceB
e&arated (it o+ (in3 ty&e.
rev nu(( Strin, A revere (in3 +ro" the anchor &eci+ied by thi (in3 to
the current docu"entE va(ue are &rovided by a &aceB
ha&e nu(( Strin, Sha&e o+ hot &ot on the creenE va(id va(ue are de+au(tE
rectE circ(e and &o(y.
tar,et nu(( Strin, <a"e o+ a +ra"e 'here the reource tar,eted by thi
(in3 'i(( be di&(ayed.
ty&e nu(( Strin, 9y&e o+ reource re+erenced by the (in3.
)ettin& Started with $ommand*in+
*o""and6in3 i ued /ut (i3e the tandard hNco""and6in3E di++erence i +or" i ub"itted 'ith
a/a0 by de+au(t.
pu-lic void save=oo29: /
//8ave -oo2
0
0
112
<p:command7in2 action7istener'(./-oo2=ean.save=oo20(>
<h:output!e&t value'(8ave( />
</p:command7in2>
S+innin&
*o""and6in3 render an ht"( anchor e(e"ent that style and styleClass attribute a&&(y.
113
#.22 $on%irm
*on+ir" i a behavior e(e"ent ued to inte,rate 'ith ,(oba( con+ir" dia(o,.
In%o
9a, confirm
1ehavior Id org.primefaces.&e"avior.#onfirm%e"avior
Attributes
header nu(( Strin, .eader o+ con+ir" dia(o,.
"ea,e nu(( Strin, 8ea,e to di&(ay in con+ir" dia(o,.
icon nu(( Strin, Icon to di&(ay ne0t to "ea,e.
)ettin& started with $on%irm
See ,(oba( con+ir" dia(o, to&ic in ne0t ection +or detai(.
114
#.22 $on%irmDialo&
*on+ir"Dia(o, i a re&(ace"ent to the (e,acy /avacri&t con+ir"ation bo0. S3innin,E cuto"i=ation
and avoidin, &o&u& b(oc3er are notab(e advanta,e over c(aic /avacri&t con+ir"ation.
In%o
9a, confirmDialog
*o"&onent *(a org.primefaces.component.confirmdialog.#onfirmDialog
*o"&onent 9y&e org.primefaces.component.#onfirmDialog
Renderer 9y&e org.primefaces.component.#onfirmDialogenderer
Renderer *(a org.primefaces.component.confirmdialog.#onfirmDialogenderer
Attributes
"ea,e nu(( Strin, 9e0t to be di&(ayed in body.
header nu(( Strin, 9e0t +or the header.
everity nu(( Strin, 8ea,e everity +or the di&(ayed icon.
'idth auto Inte,er Width o+ the dia(o, in &i0e(
hei,ht auto Inte,er Width o+ the dia(o, in &i0e(
ty(e nu(( Strin, In(ine ty(e o+ the dia(o, container.
ty(e*(a nu(( Strin, Sty(e c(a o+ the dia(o, container
115
c(oab(e true 1oo(ean De+ine i+ c(oe icon hou(d be di&(ayed or not
a&&end9o +a(e 1oo(ean A&&end the dia(o, to the e(e"ent de+ined by the ,iven
earch e0&reion.
viib(e +a(e 1oo(ean Whether to di&(ay con+ir" dia(o, on (oad.
ho'E++ect nu(( Strin, E++ect to ue on ho'in, dia(o,.
hideE++ect nu(( Strin, E++ect to ue on hidin, dia(o,.
c(oe7nEca&e +a(e 1oo(ean De+ine i+ dia(o, hou(d hide on eca&e 3ey.
,(oba( +a(e 1oo(ean When enab(edE con+ir"Dia(o, beco"e a hared +or other
co"&onent that reCuire con+ir"ation.
)ettin& started with $on%irmDialo&
*on+ir"Dia(o, ha t'o "odeK ,(oba( and nonB,(oba(. <onBG(oba( "ode i a("ot a"e a the
dia(o, co"&onent ued 'ith a i"&(e c(ient ide a&iE show! and hide!.
<h:form>
<p:command=utton type'(-utton( onclic2'(#69?cd?:.show9:( />
<p:confirmDialog message'(<re you sure a-out destroying the worldM(
header'(Initiating destroy process( severity'(alert(
widget@ar'(cd(>
<p:command=utton value'("es 8ure( action7istener'(./-utton=ean.destroy1orld0(
update'(messages( oncomplete'(#69?cd?:.hide9:(/>
<p:command=utton value'(Jot "et( onclic2'(#69?cd?:.hide9:;( type'(-utton( />
</p:confirmDialog>
</h:form>
Messa&e and Seerity
8ea,e can be de+ined in t'o 'ayE either via "ea,e o&tion or "ea,e +acet. 8ea,e +acet i
ue+u( i+ you need to &(ace cuto" content intead o+ i"&(e te0t. <ote that header can a(o be
de+ined uin, the header attribute or the header +acet. Severity de+ine the icon to di&(ay ne0t to
the "ea,eE de+au(t everity i alert and the other o&tion i info.
<p:confirmDialog widget@ar'(cd( header'onfirm>
<f:facet name'(message(>
<h:output!e&t value'(<re you sureM( />
</f:facet>
//content
</p:confirmDialog>
)lobal
*reatin, a con+ir"Dia(o, +or a &eci+ic action i a re&etitive ta3E to o(ve thi ,(oba( con+ir"Dia(o,
'hich i a in,(eton ha been introduced. 9ri,,er co"&onent need to have &Ncon+ir" behavior to
116
ue the con+ir" dia(o,. *o"&onent that tri,,er the actua( co""and in dia(o, "ut have ui1confirm1
dialog1yes ty(e c(aE i"i(ar(y co"&onent to cance( the co""and "ut have ui1confirm1dialog1no.
At the "o"ent &Ncon+ir" i u&&orted by &Nco""and1utton and &Nco""and6in3.
<p:growl id'(messages( />

<p:command=utton value'(8ave( action7istener'(./-ean.save0( update'(messages(>
<p:confirm header'(onfirmation( message'(8ureM( icon'(ui3icon3alert(/>
</p:command=utton>

<p:confirmDialog glo-al'(true(>
<p:command=utton value'("es( type'(-utton( stylelass'(ui3confirmdialog3yes(
icon'(ui3icon3chec2(/>
<p:command=utton value'(Jo( type'(-utton( stylelass'(ui3confirmdialog3no(
icon'(ui3icon3close(/>
</p:confirmDialog>
$lient Side API
Wid,etN PrimeFaces.widget.Confirm'ialog
ho'?@ B void Di&(ay dia(o,.
hide?@ B void *(oe dia(o,.
S+innin&
*on+ir"Dia(o, reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. A
)tyle #lass Applies
.uiBdia(o, *ontainer e(e"ent o+ dia(o,
.uiBdia(o,Btit(ebar 9it(e bar
.uiBdia(o,Btit(e .eader te0t
.uiBdia(o,Btit(ebarBc(oe *(oe icon
.uiBdia(o,Bcontent Dia(o, body
.uiBdia(o,Bbutton&ane #ooter button &ane(
117
#.2# $ontentFlow
*ontent#(o' i a hori=onta( content ,a((ery co"&onent 'ith a (ide ani"ation.

In%o
9a, content+lo0
*o"&onent *(a org.primefaces.component.contentflo0.#ontent+lo0
*o"&onent 9y&e org.primefaces.component.#ontent+lo0
Renderer 9y&e org.primefaces.component.#ontent+lo0enderer
Renderer *(a org.primefaces.component.contentflo0.#ontent+lo0enderer
Attributes
rendered.
va(ue nu(( Strin, *o((ection o+ ite" to di&(ay.
var nu(( Strin, <a"e o+ the iterator to di&(ay an ite".
118
)ettin& Started with $ontentFlow
*ontent#(o' reCuire content a chi(dren that can either be de+ined dyna"ica((y uin, iteration or
one by one. Each ite" "ut have the content ty(e c(a a&&(ied a 'e((.
Static I"a,e
<p:content6low>
<p:graphicImage value'(/images/photo*.,pg( stylelass'(content( />
<p:graphicImage value'(/images/photoA.,pg( stylelass'(content( />
<p:graphicImage value'(/images/photoA.,pg( stylelass'(content( />
</p:content6low>
Dyna"ic I"a,e
<p:content6low var'(image( value'(./-ean.images0(>
<p:graphicImage value'(/images/./image0( stylelass'(content( />
</p:content6low>
$aption
9o &reent a ca&tion a(on, 'ith an ite"E e"bed a div 'ith Ica&tionI ty(e c(a inide.
<p:content6low var'(image( value'(./-ean.images0(>
<p:graphicImage value'(./image.path0( stylelass'(content( />
<div class'(caption(>./image.title0</div>
</p:content6low>
S+innin&
*ontent#(o' reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. A 3innin,
ty(e c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBcontent+(o' *ontainer e(e"ent.
.+(o' *ontainer o+ ite" (it
.ite" Ite" container
.ca&tion *a&tion e(e"ent
119
#.2' $onte-tMenu
*onte0t8enu &rovide an over(ay "enu di&(ayed on "oue ri,htBc(ic3 event.
In%o
9a, conte$t!enu
*o"&onent *(a org.primefaces.component.conte$tmenu.#onte$t!enu
*o"&onent 9y&e org.primefaces.component.#onte$t!enu
Renderer 9y&e org.primefaces.component.#onte$t!enuenderer
Renderer *(a org.primefaces.component.conte$tmenu.#onte$t!enuenderer
Attributes
+or nu(( Strin, Id o+ the co"&onent to attach to
ty(e nu(( Strin, Sty(e o+ the "ain container e(e"ent
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container e(e"ent
"ode( nu(( 8enu8ode( 8enu "ode( intance to create "enu &ro,ra""atica((y.
node9y&e nu(( Strin, S&eci+ic ty&e o+ tree node to attach to.
event nu(( Strin, Event to bind conte0t8enu di&(ayE de+au(t i
conte0t"enu a3a ri,ht c(ic3.
be+oreSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute be+ore ho'in,.
120
)ettin& started with $onte-tMenu
*onte0t8enu i created 'ith ub"enu and "enuite". 7&tiona( +or attribute de+ine 'hich
co"&onent the conte0t8enu i attached to. When +or i not de+inedE conte0t8enu i attached to the
&a,e "eanin,E ri,htBc(ic3 on any'here on &a,e 'i(( di&(ay the "enu.
<p:conte&t5enu>
<p:menuitem value'(8ave( action7istener'(./-ean.save0( update'(msg(/>
<p:menuitem value'(Delete( action7istener'(./-ean.delete0( a,a&'(false(/>
<p:menuitem value'(Io 4ome( url'( www.primefaces.org( target'(L-lan2(/>
</p:conte&t5enu
*onte0t8enu e0a"&(e above i attached to the 'ho(e &a,e and conit o+ three di++erent
"enuite" 'ith di++erent ue cae. #irt "enuite" tri,,er an a/a0 actionE econd one tri,,er a
nonBa/a0 action and third one i ued +or navi,ation.
Attachment
*onte0t8enu can be attached to any AS# co"&onentE thi "ean ri,ht c(ic3in, on the attached
co"&onent 'i(( di&(ay the conte0t8enu. #o((o'in, e0a"&(e de"ontrate an inte,ration bet'een
conte0t8enu and i"a,eS'itcherE conte0t8enu here i ued to navi,ate bet'een i"a,e.
<p:image8witch id'(images( widget@ar'(gallery( slideshow<uto'(false(>
<p:graphicImage value'(/images/nature*.,pg( />
<p:graphicImage value'(/images/natureA.,pg( />
<p:graphicImage value'(/images/nature).,pg( />
<p:graphicImage value'(/images/natureE.,pg( />
</p:image8witch>
<p:conte&t5enu for'(images(>
<p:menuitem value'(#revious( url'(.( onclic2'(#69?gallery?:.previous9:( />
<p:menuitem value'(Je&t( url'(.( onclic2'(#69?gallery?:.ne&t9:( />
</p:conte&t5enu>
<o' ri,htBc(ic3in, any'here on an i"a,e 'i(( di&(ay the conte0t8enu (i3eK
Data $omponents
Data co"&onent (i3e datatab(eE tree and tree9ab(e ha &ecia( inte,ration 'ith conte0t "enuE ee
the docu"entation o+ thee co"&onent +or "ore in+or"ation.
121
Dynamic Menus
*onte0t8enu can be created &ro,ra""atica((y a 'e((E ee the dyna"ic "enu &art in "enu
co"&onent ection +or "ore in+or"ation and an e0a"&(e.
S+innin&
*onte0t8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i
)tyle #lass Applies
.uiBconte0t"enu *ontainer e(e"ent o+ "enu
.uiB"enuB(it 6it container
.uiB"enuite" Each "enu ite"
.uiB"enuite"B(in3 Anchor e(e"ent in a (in3 ite"
.uiB"enuite"Bte0t 9e0t e(e"ent in an ite"
122
#.23 Dashboard
Dahboard &rovide a &orta( (i3e (ayout 'ith dra,:dro& baed reorder ca&abi(itie.
In%o
9a, das"&oard
*o"&onent *(a org.primefaces.component.das"&oard.Das"&oard
*o"&onent 9y&e org.primefaces.component.Das"&oard
Renderer 9y&e org.primefaces.component.Das"&oardenderer
Renderer *(a org.primefaces.component.das"&oard.Das"&oardenderer
Attributes
rendered.
'id,et>ar nu(( Strin, <a"e o+ the c(ient ide 'id,et
"ode( nu(( Dahboard
8ode(
Dahboard "ode( intance re&reentin, the (ayout o+
the UI.
diab(ed +a(e 1oo(ean Diab(e reorderin, +eature.
ty(e nu(( Strin, In(ine ty(e o+ the dahboard container
ty(e*(a nu(( Strin, Sty(e c(a o+ the dahboard container
123
)ettin& started with Dashboard
Dahboard i bac3ed by a Dahboard8ode( and conit o+ &ane( co"&onent.
<p:dash-oard model'(./-ean.model0(>
<p:panel id'(sports(>
//8ports ontent
</p:panel>
<p:panel id'(finance(>
//6inance ontent
</p:panel>
//more panels li2e lifestyleH weatherH politics...
</p:dash-oard>
Dahboard "ode( i"&(y de+ine the nu"ber o+ co(u"n and the 'id,et to be &(aced in each
co(u"n. See the end o+ thi ection +or the detai(ed Dahboard A!I.
pu-lic class =ean /
private Dash-oard5odel model;
pu-lic =ean9: /
model ' new DefaultDash-oard5odel9:;
Dash-oardolumn column* ' new DefaultDash-oardolumn9:;
Dash-oardolumn columnA ' new DefaultDash-oardolumn9:;
Dash-oardolumn column) ' new DefaultDash-oardolumn9:;
column*.add1idget9(sports(:;
column*.add1idget9(finance(:;
columnA.add1idget9(lifestyle(:;
columnA.add1idget9(weather(:;
column).add1idget9(politics(:;
model.addolumn9column*:;
model.addolumn9columnA:;
model.addolumn9column):;
0
0
State
Dahboard i a tate+u( co"&onentE 'henever a 'id,et i reordered dahboard "ode( 'i(( be
u&datedE by &eritin, the uer chan,e o you can eai(y create a tate+u( dahboard.
A,a- .ehaior /ents
reorder i the one and on(y a/a0 behavior event &rovided by dahboardE thi event i +ired 'hen
dahboard &ane( are reordered. A de+ined (itener 'i(( be invo3ed by &ain, an
org.primefaces.event.'ashboard+eorderEvent intance containin, in+or"ation about reorder.
#o((o'in, dahboard di&(ay a "ea,e about the reorder event
124
<p:dash-oard model'(./-ean.model0(>
<p:a,a& event'reorder update'messages listener'./-ean.handleCeorder0 />
//panels
</p:dash-oard>
pu-lic class =ean /
...
pu-lic void handleCeorder9Dash-oardCeorder$vent event: /
8tring widgetId ' event.get1idgetId9:;
int widgetInde& ' event.getItemInde&9:;
int columnInde& ' event.getolumnInde&9:;
int senderolumnInde& ' event.get8enderolumnInde&9:;
//<dd facesmessage
0
0
I+ a 'id,et i reordered in the a"e co(u"nE senderColumn*nde$ 'i(( be nu((. 9hi +ie(d i
&o&u(ated on(y 'hen a 'id,et i tran+erred to a co(u"n +ro" another co(u"n. A(o 'hen the
(itener i invo3edE dahboard ha a(ready u&dated it "ode(.
Disablin& Dashboard
I+ youd (i3e to diab(e reorderin, +eatureE et disabled o&tion to true.
<p:dash-oard disa-led'(true( ...>
//panels
</p:dash-oard>
1o&&le? $lose and ;ptions Menu
Wid,et &reented in dahboard can be c(oab(eE to,,(eab(e and have o&tion "enu a 'e((E
dahboard doent i"&(e"ent thee by ite(+ a thee +eature are a(ready &rovided by the &ane(
co"&onent. See &ane( co"&onent ection +or "ore in+or"ation.
<p:dash-oard model'(./dash-oard=ean.model0(>
<p:panel id'(sports( closa-le'(true( togglea-le'(true(>
//8ports ontent
</p:panel>
</p:dash-oard>
0ew Wid&ets
Dra,,ab(e co"&onent i ued to add ne' 'id,et to the dahboard. 9hi 'ay you can add ne'
&ane( +ro" outide o+ the dahboard.
125
<p:dash-oard model'(./dash-oard=ean.model0( id'(-oard(>
//panels
</p:dash-oard>
<p:panel id'(newwidget( />
<p:dragga-le for'(newwidget( helper'(clone( dash-oard'(-oard( />
S+innin&
Dahboard reide in a container e(e"ent 'hich ty(e and ty(e*(a o&tion a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiBdahboard *ontainer e(e"ent o+ dahboard
.uiBdahboardBco(u"n Each co(u"n in dahboard
div.uiBtateBhover !(aceho(der
A 3innin, ty(e c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation. .ere i an
e0a"&(e baed on a di++erent the"eK
1ips
!rovide a co(u"n 'idth uin,

ui1dashboard1column ty(e c(a other'ie e"&ty co(u"n "i,ht
not receive ne' 'id,et.
Dashboard Model API
org.primefaces.model.'ashboard-odel ?org.primefaces.model.map.'efault'ashboard-odel i the
de+au(t i"&(e"entation@
!et"od Description
void add*o(u"n?Dahboard*o(u"n co(u"n@ Add a co(u"n to the dahboard
6itSDahboard*o(u"nT ,et*o(u"n?@ Return a(( co(u"n in dahboard
int ,et*o(u"n*ount?@ Return the nu"ber o+ co(u"n in dahboard
Dahboard*o(u"n ,et*o(u"n?int inde0@ Return the dahboard co(u"n at ,iven inde0
void tran+erWid,et?Dahboard*o(u"n +ro"E
Dahboard*o(u"n toE Strin, 'id,etIdE int inde0@
Re(ocate the 'id,et identi+ed 'ith 'id,et id to the
,iven inde0 o+ the ne' co(u"n +ro" o(d co(u"n.
126
org.primefaces.model.'ashboardColumn ?org.primefaces.model.map.'efault'ashboard-odel i
the de+au(t i"&(e"entation@
!et"od Description
void re"oveWid,et?Strin, 'id,etId@ Re"ove the 'id,et 'ith the ,iven id
6itSStrin,T ,etWid,et?@ Return the id o+ 'id,et in co(u"n
int ,etWid,et*ount?@ Return the count o+ 'id,et in co(u"n
Strin, ,etWid,et?int inde0@ Return the 'id,et id 'ith the ,iven inde0
void addWid,et?Strin, 'id,etId@ Add a ne' 'id,et 'ith the ,iven id
void addWid,et?int inde0E Strin, 'id,etId@ Add a ne' 'id,et at ,iven inde0
void reorderWid,et?int inde0E Strin, 'id,etId@ U&date the inde0 o+ 'id,et in co(u"n
127
#.25 Data/-porter
DataE0&orter i handy +or e0&ortin, data (ited uin, a !ri"e+ace Datatab(e to variou +or"at
uch a e0ce(E &d+E cv and 0"(.
In%o
9a, data'$porter
9a, *(a org.primefaces.component.e$port.Data'$porterTag
Action6itener *(a org.primefaces.component.e$port.Data'$porter
Attributes
ty&e nu(( Strin, E0&ort ty&eN I0(IEI&d+IEIcvIE I0"(I
tar,et nu(( Strin, Id o+ the datatab(e 'hoe data to e0&ort.
+i(e<a"e nu(( Strin, #i(ena"e o+ the ,enerated e0&ort +i(eE de+au(t to
datatab(e id.
&a,e7n(y 0 Strin, E0&ort on(y current &a,e intead o+ 'ho(e dataet
&re!roceor nu(( 8ethodE0&r !re!roceor +or the e0&orted docu"ent.
&ot!roceor nu(( 8ethodE0&r !ot!roceor +or the e0&orted docu"ent.
encodin, U9#B2 1oo(ean *haracter encodin, to ue
e(ection7n(y 0 1oo(ean When enab(edE on(y e(ection 'ou(d be e0&orted.
)ettin& Started with Data/-porter
DataE0&orter i neted in a UI*o""and co"&onent uch a co""and1utton or co""and6in3. #or
&d+ e0&ortin, ite$t and +or 0( e0&ortin, poi (ibrarie are reCuired in the c(a&ath. 9ar,et "ut
&oint to a !ri"e#ace Datatab(e. Au"e the tab(e to be e0&orted i de+ined aK
<p:data!a-le id'(ta-leId( ...>
//columns
</p:data!a-le>
E$cel e$port
<p:command=utton value'($&port as $&cel( a,a&'(false(>
<p:data$&porter type'(&ls( target'(ta-leId( fileJame'(cars(/>
</p:command=utton>
P'F e$port
128
<p:command=utton value'($&port as #D6( a,a&'(false( >
<p:data$&porter type'(pdf( target'(ta-leId( fileJame'(cars(/>
</p:command=utton>
CS2 e$port
<p:command=utton value'($&port as 8@( a,a&'(false( >
<p:data$&porter type'(csv( target'(ta-leId( fileJame'(cars(/>
</p:command=utton>
3-& e$port
<p:command=utton value'($&port as N57( a,a&'(false( >
<p:data$&porter type'(&ml( target'(ta-leId( fileJame'(cars(/>
</p:command7in2>
Pa&e;nly
1y de+au(t dataE0&orter 'or3 on 'ho(e dataetE i+ youd (i3e e0&ort on(y the data di&(ayed on
current &a,eE et &a,e7n(y to true.
<p:data$&porter type'(pdf( target'(ta-leId( fileJame'(cars( pageOnly'(true(/>
/-cludin& $olumns
In cae you need one or "ore co(u"n to be i,nored et e$portable o&tion o+ co(u"n to +a(e.
<p:column e&porta-le'(false(>
//...
</p:column>
Monitor Status
DataE0&ort i a nonBa/a0 &roce o a/a0Statu co"&onent cannot a&&(y. See #i(eDo'n(oad
8onitor Statu ection to +ind out ho' "onitor e0&ort &roce. Sa"e o(ution a&&(ie to data e0&ort
a 'e((.
Pre and Post Processors
!roceor are handy to cuto"i=e the e0&orted docu"ent ?e.,. add (o,oE ca&tion ...@. !re!roceor
are e0ecuted be+ore the data i e0&orted and !ot!roceor are &roceed a+ter data i inc(uded in
the docu"ent. !roceor are i"&(e /ava "ethod ta3in, the docu"ent a a &ara"eter.
*han,e E0ce( 9ab(e .eader
#irt e0a"&(e o+ &roceor chan,e the bac3,round co(or o+ the e0&orted e0ce( header.
129
<h:command=utton value'($&port as N78(>
<p:data$&porter type'(&ls( target'(ta-leId( fileJame'(cars(
post#rocessor'(./-ean.post#rocessN780(/>
</h:command=utton>
pu-lic void post#rocessN789O-,ect document: /
48861or2-oo2 w- ' 948861or2-oo2: document;
48868heet sheet ' w-.get8heet<t90:;
4886Cow header ' sheet.getCow90:;
4886ell8tyle cell8tyle ' w-.createell8tyle9:;
cell8tyle.set6ill6oregroundolor94886olor.IC$$J.inde&:;
cell8tyle.set6ill#attern94886ell8tyle.8O7IDL6OC$ICOKJD:;
for9int i'0; i < header.get#hysicalJum-erOfells9:;i>>: /
header.getell9i:.setell8tyle9cell8tyle:;
0
0
Add 6o,o to !D#
9hi e0a"&(e add a (o,o to the !D# be+ore e0&ortin, be,in.
<h:command=utton value'($&port as #D6(>
<p:data$&porter type'(pdf( target'(ta-leId( fileJame'(cars(
pre#rocessor'(./-ean.pre#rocess#D60(/>
</h:command=utton>
pu-lic void pre#rocess#D69O-,ect document: throws IO$&ceptionH
=ad$lement$&ceptionH Document$&ception /
Document pdf ' 9Document: document;
8ervletonte&t servletonte&t ' 98ervletonte&t:
6acesonte&t.geturrentInstance9:.get$&ternalonte&t9:.getonte&t9:;
8tring logo ' servletonte&t.getCeal#ath9((: > 6ile.separator > (images( >
6ile.separator > (primeLlogo.png(;
pdf.add9Image.getInstance9logo::;
0
130
#.26 Data)rid
DataGrid di&(ay a co((ection o+ data in a ,rid (ayout.
In%o
9a, data/rid
*o"&onent *(a org.primefaces.component.datagrid.Data/rid
*o"&onent 9y&e org.primefaces.component.Data/rid
Renderer 9y&e org.primefaces.component.Data/ridenderer
Renderer *(a org.primefaces.component.datagrid.Data/ridenderer
Attributes
rendered true boo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the
co"&onentE 'hen et to +a(e co"&onent 'i((
not be rendered.
131
va(ue nu(( 7b/ect Data to di&(ay.
var nu(( Strin, <a"e o+ the reCuetBco&ed variab(e ued to
re+er each data.
ro' nu(( Inte,er <u"ber o+ ro' to di&(ay &er &a,e.
+irt 0 Inte,er Inde0 o+ the +irt ro' to be di&(ayed
co(u"n ) Inte,er <u"ber o+ co(u"n in ,rid.
&a,inator +a(e boo(ean Enab(e &a,ination.
&a,inator9e"&(ate nu(( Strin, 9e"&(ate o+ the &a,inator.
ro'!er!a,e9e"&(ate nu(( Strin, 9e"&(ate o+ the ro'!er!a,e dro&do'n.
current!a,eRe&ort9e"&(ate nu(( Strin, 9e"&(ate o+ the current!a,eRe&ort UI.
&a,e6in3 10 Inte,er 8a0i"u" nu"ber o+ &a,e (in3 to di&(ay.
&a,inator!oition both Strin, !oition o+ the &a,inator.
&a,inatorA('ay>iib(e true 1oo(ean De+ine i+ &a,inator hou(d be hidden i+ tota(
data count i (e than nu"ber o+ ro' &er
&a,e.
ty(e nu(( Strin, In(ine ty(e o+ the data,rid.
ty(e*(a nu(( Strin, Sty(e c(a o+ the data,rid.
ro'Inde0>ar nu(( Strin, <a"e o+ the iterator to re+er each ro' inde0.
(a=y +a(e 1oo(ean De+ine i+ (a=y (oadin, i enab(ed +or the data
co"&onent.
e"&ty8ea,e <o
record
+ound.
Strin, 9e0t to di&(ay 'hen there i no data to
di&(ay.
)ettin& started with the Data)rid
A (it o+ car 'i(( be ued throu,hout the data,ridE data(it and datatab(e e0a"&(e.
pu-lic class ar /
private 8tring model;
private int year;
private 8tring manufacturer;
...
0
9he code +or *ar1ean that 'ou(d be ued to bind the data,rid to the car (it.
132
pu-lic ar=ean9: /
cars.add9new ar9(my5odel(HA005H(5anufacturerN(H(-lue(::;
//add more cars
0
pu-lic 7ist<ar> getars9: /
return cars;
0
0
<p:dataIrid var'(car( value'(./car=ean.cars0( columns'()( rows'(*A(>
<p:column>
<p:panel header'(./car.model0(>
<h:panelIrid columns'(*(>
<h:output!e&t value'(./car.year0( />
</h:panelIrid>
</p:panel>
</p:column>
</p:dataIrid>
9hi data,rid ha ) co(u"n and 1% ro'. A data,rid e0tend +ro" tandard UIDataE ro'
corre&ond to the nu"ber o+ data to di&(ay not the nu"ber o+ ro' to render o the actua( nu"ber
o+ ro' to render i ro'Qco(u"n P -. A a reu(t data,rid i di&(ayed aK
133
A,a- Pa&ination
DataGrid ha a bui(tBin &a,inator that i enab(ed by ettin, &a,inator o&tion to true.
<p:dataIrid var'(car( value'(./car=ean.cars0( columns'()( rows'(*A(
paginator'(true(>
...
</p:dataIrid>
Pa&inator 1emplate
!a,inator i cuto"i=ed uin, &a,inator9e"&(ate7&tion that acce&t variou 3ey o+ UI contro(.
<ote that thi ection a&&(ie to dataGridE data6it and data9ab(e.
G #irt!a,e6in3
G 6at!a,e6in3
G !reviou!a,e6in3
G <e0t!a,e6in3
G !a,e6in3
G *urrent!a,eRe&ort
G Ro'!er!a,eDro&do'n
<ote that VRo'!er!a,eDro&do'nW ha it o'n te"&(ateE o&tion to di&(ay i &rovided via
ro'!er!a,e9e"&(ate attribute ?e.,. ro'!er!a,e9e"&(atePI9E1%E15I@.
A(o V*urrent!a,eRe&ortW ha it o'n te"&(ate de+ined 'ith current!a,eRe&ort9e"&(ate o&tion.
Mou can ue Vcurrent!a,eWEVtota(!a,eWEVtota(RecordWEVtartRecordWEVendRecordW 3ey'ord
'ithin current!a,eRe&ort9e"&(ate. De+au(t i Vcurrent!a,eW o+Vtota(!a,eW. De+au(t UI iK
'
hich corre&ond to the +o((o'in, te"&(ate.
IV#irt!a,e6in3W V!reviou!a,e6in3W V!a,e6in3W V<e0t!a,e6in3W V6at!a,e6in3WI
.ere are "ore e0a"&(e baed on di++erent te"&(ateK
I V*urrent!a,eRe&ortW V#irt!a,e6in3W V!reviou!a,e6in3W V!a,e6in3W V<e0t!a,e6in3W
V6at!a,e6in3W VRo'!er!a,eDro&do'nWI
I V!reviou!a,e6in3W V*urrent!a,eRe&ortW V<e0t!a,e6in3WI
Pa&inator Position
!a,inator can be &oitoned uin, paginatorPosition attribute in three di++erent (ocationE Ito&IE
Ibotto"I or IbothI ?de+au(t@.
134
Selectin& Data
Se(ection o+ data di&(ayed in data,rid i very i"i(ar to ro' e(ection in datatab(eE you can acce
the current data uin, the var re+erence. .ere i an e0a"&(e to de"ontrate ho' to e(ect data +ro"
data,rid and di&(ay 'ithin a dia(o, 'ith a/a0.
<h:form id'(car6orm(>
<p:dataIrid var'(car( value'(./car=ean.cars0( columns'()( rows'(*A(>
<p:panel header'(./car.model0(>
<p:command7in2 update'(:car6orm:display( oncomplete'(#69?dlg?:.show9:(>
<f:set#roperty<ction7istener value'(./car0(
target'(./car=ean.selectedar0(
</p:command7in2>
</p:panel>
</p:dataIrid>
<p:dialog modal'(true( widget@ar'(dlg(>
<h:panelIrid id'(display( columns'(A(>
</f:facet>
<h:output!e&t value'(5odel:( />
<h:output!e&t value'(./car=ean.selectedar.year0( />
//more selectedar properties
</h:panelIrid>
</p:dialog>
</h:form>
private ar selectedar;
0
A,a- .ehaior /ents
&a,e or,.&ri"e+ace.event.data.!a,eEvent 7n &a,ination.
135
<p:dataIrid var'(car( value'(./car=ean.model0(>
<p:a,a& event'(page( update'anothercomponent( />
//content
</p:dataIrid>
$lient Side API
Wid,etN PrimeFaces.widget.'ata0rid
,et!a,inator?@ B !a,inator Return the &a,inator 'id,et.
S+innin&
DataGrid reide in a "ain div container 'hich ty(e and ty(e*(a attribute a&&(y. #o((o'in, i
#lass Applies
.uiBdata,rid 8ain container e(e"ent
.uiBdata,ridBcontent *ontent container.
.uiBdata,ridBdata 9ab(e e(e"ent containin, data
.uiBdata,ridBro' A ro' in ,rid
.uiBdata,ridBco(u"n A co(u"n in ,rid
1ips
G DataGrid u&&ort (a=y (oadin, data via 6a=yData8ode(E ee Data9ab(e (a=y (oadin, ection.
DataGrid &rovide t'o +acet na"ed

header and footer that you can ue to &rovide cuto"
content at thee (ocation.
136
#.27 Data*ist
Data6it &reent a co((ection o+ data in (it (ayout 'ith evera( di&(ay ty&e.
In%o
9a, data*ist
*o"&onent *(a org.primefaces.component.datalist.Data*ist
*o"&onent 9y&e org.primefaces.component.Data*ist.Data*istTag
Renderer 9y&e org.primefaces.component.Data*istenderer
Renderer *(a org.primefaces.component.datalist.Data*istenderer
Attributes
not be rendered.
re+er each data.
137
ty&e unordered Strin, 9y&e o+ the (itE va(id va(ue are IunorderedIE
IorderedIE Ide+initionI and InoneI.
ite"9y&e nu(( Strin, S&eci+ie the (it ite" ty&e.
&a,inator +a(e boo(ean Enab(e &a,ination.
&a,inatorA('ay>iib(e true 1oo(ean De+ine i+ &a,inator hou(d be hidden i+ tota(
data count i (e than nu"ber o+ ro' &er
&a,e.
ty(e nu(( Strin, In(ine ty(e o+ the "ain container.
ty(e*(a <u(( Strin, Sty(e c(a o+ the "ain container.
ro'Inde0>ar nu(( Strin, <a"e o+ the iterator to re+er each ro' inde0.
varStatu nu(( Strin, <a"e o+ the e0&orted reCuet co&ed variab(e
to re&reent tate o+ the iteration a"e a in
uiNre&eat varStatu.
co"&onent.
e"&ty8ea,e <o record
+ound.
Strin, 9e0t to di&(ay 'hen there i no data to
di&(ay.
ite"Sty(e*(a nu(( Strin, Sty(e c(a o+ an ite" in (it.
)ettin& started with the Data*ist
Since Data6it i a data iteration co"&onentE it render it chi(dren +or each data re&reented 'ith
var o&tion. See ite"9y&e ection +or "ore in+or"ation about the &oib(e va(ue.
<p:data7ist value'(./car=ean.cars0( var'(car( item!ype'(disc(>
./car.manufacturer0H ./car.year0
</p:data7ist>
;rdered *ists
Data6it di&(ay the data in unordered +or"at by de+au(tE i+ youd (i3e to ue ordered di&(ay et
type o&tion to IorderedI.
138
<p:data7ist value'(./car=ean.cars0( var'(car( type'(ordered(>
</p:data7ist>
Item 1ype
itemType de+ine the bu((et ty&e o+ each ite". #or ordered (itE in addition to co""on(y ued
decimal ty&eE +o((o'in, ite" ty&e are avai(ab(eK
B A
B a
B i
And +or unordered (itE avai(ab(e va(ue areK
B dic
B circ(e
B Cuare
De%inition *ists
9hird ty&e o+ data6it i de+inition (it that di&(ay in(ine decri&tion +or each ite"E to ue
de+inition (it et type o&tion to 4definition4. Detai( content i &rovided 'ith the +acet ca((ed
4description4.
<p:data7ist value'(./car=ean.cars0( var'(car( type'(definition(>
5odel: ./car.model0H "ear: ./car.year0
<f:facet name'(description(>
</f:facet>
</p:data7ist>
A,a- Pa&ination
Data6it ha a bui(tBin &a,inator that i enab(ed by ettin, &a,inator o&tion to true.
<p:data7ist value'(./car=ean.cars0( var'(car( paginator'(true( rows'(*0(>
</p:data7ist>
!a,ination con+i,uration and ua,e i a"e a dataGridE ee &a,ination ection in dataGrid
docu"entation +or "ore in+or"ation and e0a"&(e.
139
Selectin& Data
Data e(ection can be i"&(e"ented a"e a in dataGridE ee e(ectin, data ection in dataGrid
docu"entation +or "ore in+or"ation and an e0a"&(e.
$lient Side API
Wid,etN PrimeFaces.widget.'ata&ist
,et!a,inator?@ B !a,inator Return the &a,inator 'id,et.
S+innin&
Data6it reide in a "ain div container 'hich ty(e and ty(e*(a attribute a&&(y. #o((o'in, i the
#lass Applies
.uiBdata(it 8ain container e(e"ent
.uiBdata(itBcontent *ontent container
.uiBdata(itBdata Data container
.uiBdata(itBite" Each ite" in (it
1ips
G Data6it u&&ort (a=y (oadin, data via 6a=yData8ode(E ee Data9ab(e (a=y (oadin, ection.
I+ you need +u(( contro( over (it ty&e "ar3u&E et ty&e to

none. With thi ettin,E data(it doe
not render ite" ta, (i3e (i and behave (i3e uiNre&eat.
Data6it &rovide t'o +acet na"ed

header and footer that you can ue to &rovide cuto" content
at thee (ocation.
140
#.28 DataScroller
DataScro((er di&(ay a co((ection o+ data 'ith on de"and (oadin, uin, cro((in,.
In%o
9a, data)croller
*o"&onent *(a org.primefaces.component.datascroller.Data)croller
*o"&onent 9y&e org.primefaces.component.Data)croller
Renderer 9y&e org.primefaces.component.Data)crollerenderer
Renderer *(a org.primefaces.component.datascroller.Data)crollerenderer
Attributes
not be rendered.
141
re+er each data.
ty(e*(a <u(( Strin, Sty(e c(a o+ the "ain container.
chun3Si=e 0 int <u"ber o+ ite" to +etch in each (oad.
ro'Inde0>ar nu(( Strin, <a"e o+ iterator to re+er each ro' inde0.
"ode docu"ent Strin, De+ine the tar,et to (iten +or cro(( eventE
va(id va(ue are Idocu"entI ?de+au(t@ and
Iin(ineI.
cro((.ei,ht nu(( Strin, De+ine &i0e( hei,ht o+ the vie'&ort in in(ine
"ode.
co"&onent.
bu++er 10 Inte,er !ercenta,e hei,ht o+ the bu++er bet'een the
botto" o+ the &a,e and the cro(( &oition to
initiate the (oad +or the ne' chun3. >a(ue i
de+ined in inte,er and de+au(t i 10 "eanin,
(oad 'ou(d ha&&en a+ter 90R o+ the vie'&ort
i cro((ed do'n.
)ettin& started with the DataScroller
DataScro((er reCuire a co((ection o+ data to di&(ayE 'hen the &a,e i cro((ed do'nE datacro((er
'i(( do a reCuet 'ith a/a0 to +etch the ne' chun3 o+ data and a&&end the" at the botto".
<p:data8croller value'(./car=ean.cars0( var'(car( chun28iOe'(*0(>
./car.manufacturer0
//more content
</p:data7ist>
Scroll Mode
De+au(t e(e"ent 'hoe cro((bar i "onitored i &a,e ite(+E mode o&tion i ued to cuto"i=e the
cro(( tar,et. 9'o &oib(e o&tion +or the "ode attribute are [docu"ent\ and [in(ine\. Docu"ent
"ode i de+au(t and inline "ode (iten to the cro(( event o+ the datacro((er container ite(+.
142
<p:data8croller value'(./car=ean.cars0( var'(car( mode'(inline( chun28iOe'(*0(>
./car.manufacturer0
//more content
</p:data7ist>
*oader
In cae o+ cro((in,E a UI e(e"ent uch a button can de+ined a the (oader o that ne' data i (oaded
'hen the (oader e(e"ent i c(ic3ed. 6oader co"&onent i de+ined uin, I(oaderI +acet.
<p:data8croller value'(./car=ean.cars0( var'(car( mode'(inline( chun28iOe'(*0(>
./car.manufacturer0
//more content
<f:facet name'(loader(>
<p:command=utton type'(-utton( value'(@iew 5ore( />
</f:facet>
</p:data7ist>
*a9y *oadin&
6a=y (oadin, i enab(ed by enab(in, the (a=y attribute and &rovidin, a 6a=yData8ode( intance a
the va(ue. Re+er to (a=y (oad e0a"&(e in Data9ab(e +or an e0a"&(e about 6a=yData8ode(.
<p:data8croller value'(./car=ean.laOy5odel0( var'(car( laOy'(true(>
./car.manufacturer0
//more content
</p:data7ist>
(eader
.eader o+ the co"&onent i de+ined uin, header +acet.
<p:data8croller value'(./car=ean.laOy5odel0( var'(car(>
<f:facet name'(header(>ars</f:facet>
./car.manufacturer0
//more content
</p:data7ist>
$lient Side API
Wid,etN PrimeFaces.widget.'ataScroller
(oad?@ B void 6oad the ne0t chun3.
143
S+innin&
DataScro((er reide in a "ain div container 'hich ty(e and ty(e*(a attribute a&&(y. #o((o'in,
i the (it o+ tructura( ty(e c(aeK
#lass Applies
.uiBdatacro((er 8ain container e(e"ent
.uiBdatacro((erBin(ine 8ain container e(e"ent in in(ine "ode
.uiBdata(itBheader .eader e(e"ent
.uiBdata(itBcontent *ontent e(e"ent
.uiBdatacro((erB(it 6it e(e"ent container
.uiBdatacro((erBite" *ontainer o+ each ite" in the (it
.uiBdatacro((erB(oader *ontainer o+ cuto" (oader e(e"ent.
.uiBdatacro((erB(oadin, 1ui(tBin (oad tatu indicator
144
#.#: Data1able
Data9ab(e di&(ay data in tabu(ar +or"at.
In%o
9a, dataTa&le
*o"&onent *(a org.primefaces.component.datata&le.DataTa&le
*o"&onent 9y&e org.primefaces.component.DataTa&le
Renderer 9y&e org.primefaces.component.DataTa&leenderer
Renderer *(a org.primefaces.component.datata&le.DataTa&leenderer
Attributes
rendered +a(e 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the
be rendered.
var nu(( Strin, <a"e o+ the reCuetBco&ed variab(e ued to re+er
each data.
145
&a,inator +a(e 1oo(ean Enab(e &a,ination.
ro'!er!a,e6abe( nu(( Strin, 6abe( +or the ro'!er!a,e dro&do'n.
&a,inatorA('ay>iib(e true 1oo(ean De+ine i+ &a,inator hou(d be hidden i+ tota( data
count i (e than nu"ber o+ ro' &er &a,e.
cro((ab(e +a(e 1oo(ean 8a3e data cro((ab(e 'ith +i0ed header.
cro((.ei,ht nu(( Inte,er Scro(( vie'&ort hei,ht.
cro((Width nu(( Inte,er Scro(( vie'&ort 'idth.
e(ection8ode nu(( Strin, Enab(e ro' e(ectionE va(id va(ue are in,(e
and "u(ti&(e.
e(ection nu(( 7b/ect Re+erence to the e(ection data.
ro'Inde0>ar nu(( Strin, <a"e o+ iterator to re+er each ro' inde0.
e"&ty8ea,e <o
record
+ound.
Strin, 9e0t to di&(ay 'hen there i no data to di&(ay.
A(ternative i e"&ty8ea,e +acet.
db(*(ic3Se(ect +a(e 1oo(ean Enab(e ro' e(ection on doub(e c(ic3.
(iveScro(( +a(e 1oo(ean Enab(e (ive cro((in,.
ro'Sty(e*(a nu(( Strin, Sty(e c(a +or each ro'.
onE0&andStart nu(( Strin, *(ient ide ca((bac3 to e0ecute be+ore e0&anion.
rei=ab(e*o(u"n +a(e 1oo(ean Enab(e co(u"n rei=in,.
ort1y nu(( 7b/ect !ro&erty to be ued +or de+au(t ortin,.
ort7rder acendin, Strin, acendin, or decendin,.
cro((Ro' 0 Inte,er <u"ber o+ ro' to (oad on (ive cro((.
ro';ey nu(( Strin, UniCue identi+ier o+ a ro'.
tab(eSty(e nu(( Strin, In(ine ty(e o+ the tab(e e(e"ent.
146
tab(eSty(e*(a nu(( Strin, Sty(e c(a o+ the tab(e e(e"ent.
+i(terEvent 3eyu& Strin, Event to invo3e +i(terin, +or in&ut +i(ter.
+i(terDe(ay )00 Inte,er De(ay in "i((iecond be+ore endin, an a/a0
+i(ter Cuery.
dra,,ab(e*o(u"n +a(e 1oo(ean *o(u"n can be reordered 'ith dra,dro& 'hen
enab(ed.
editab(e +a(e 1oo(ean *ontro( ince(( editin,.
(a=y +a(e 1oo(ean *ontro( (a=y (oadin,.
+i(tered>a(ue nu(( 6it 6it to 3ee& +i(tered data.
ort8ode in,(e Strin, De+ine ortin, "odeE va(id va(ue are single and
multiple.
edit8ode ro' Strin, De+ine edit "odeE va(id va(ue are row and cell.
editin,Ro' +a(e 1oo(ean De+ine i+ ce(( editor o+ ro' hou(d be di&(ayed
a editab(e or not.
ce((Se&arator nu(( Strin, Se&arator te0t to ue in out&ut "ode o+ editab(e
ce(( 'ith "u(ti&(e co"&onent.
u""ary nu(( Strin, Su""ary attribute +or W*AG.
+ro=enRo' nu(( 7b/ect *o((ection to di&(ay a +i0ed in cro((ab(e "ode.
(iveRei=e +a(e 1oo(ean *o(u"n are rei=ed (ive in thi "ode 'ithout
uin, a rei=e he(&er.
tic3y.eader +a(e 1oo(ean Stic3y header tay in 'indo' vie'&ort durin,
cro((in,.
e0&andedRo' +a(e 1oo(ean De+ine i+ ro' hou(d be rendered a e0&anded
by de+au(t.
diab(edSe(ection +a(e 1oo(ean Diab(e ro' e(ection 'hen true.
ro'Se(ect8ode ne' Strin, De+ine ro' e(ection "ode +or "u(ti&(e
e(ection.
ro'E0&and8ode ne' Strin, De+ine ro' e0&and "odeE va(id va(ue are
Iin,(eI and I"u(ti&(eI ?de+au(t@.
data6oca(e nu(( 7b/ect 6oca(e to be ued in +eature uch a +i(terin, and
ortin,E de+au(t to vie' (oca(e.
nativeE(e"ent +a(e 1oo(ean Ue native radioBchec3bo0 e(e"ent +or ro'
e(ection.
+ro=en*o(u"n nu(( Inte,er <u"ber o+ co(u"n to +ree=e +ro" tart inde0 0.
147
dra,,ab(eRo' +a(e 1oo(ean When enab(edE ro' can be reordered uin,
dra,dro&.
caeSenitiveSort +a(e 1oo(ean *ae enitivity +or ortin,E inenitive by
de+au(t.
3i&*hi(dren +a(e 1oo(ean I,nore &rocein, o+ chi(dren durin, (i+ecyc(eE
i"&rove &er+or"ance i+ tab(e on(y ha out&ut
co"&onent.
)ettin& started with the Data1able
We 'i(( be uin, the a"e *ar and *ar1ean c(ae decribed in DataGrid ection.
<p:data!a-le var'(car( value'(./car=ean.cars0(>
<p:column>
<h:output!e&t value'(5odel( />
</f:facet>
</p:column>
//more columns
</p:data!a-le>
(eader and Footer
1oth datatab(e ite(+ and co(u"n can have cuto" content in their header and +ooter uin, header
and +ooter +acet re&ective(y. A(ternative(y +or co(u"n there are header9e0t and +ooter9e0t
hortcut to di&(ay i"&(e te0t.
148
7ist of ars
</f:facet>
<p:column>
5odel
</f:facet>
./car.model0
<f:facet name'(footer(>
G digit code
</f:facet>
</p:column>
<p:column header!e&t'("ear( footer!e&t'(*+U03A0*0(>
./car.year0
</p:column>
//more columns
In total there are ./fn:length9car=ean.cars:0 cars.
</f:facet>
</p:data!a-le>
Pa&ination
Data9ab(e ha a bui(tBin a/a0 baed &a,inator that i enab(ed by ettin, &a,inator o&tion to trueE ee
&a,ination ection in dataGrid docu"entation +or "ore in+or"ation about cuto"i=ation o&tion.
<p:data!a-le var'(car( value'(./car=ean.cars0( paginator'(true( rows'(*0(>
//columns
</p:data!a-le>
Sortin&
De+inin, sort)y attribute enab(e a/a0 baed ortin, on that &articu(ar co(u"n.
<p:column sort=y'(./car.model0( header!e&t'(5odel(>
</p:column>
...more columns
</p:data!a-le>
Intead o+ uin, the de+au(t ortin, a(,orith" 'hich ue a /ava co"&aratorE you can &(u,Bin your
o'n ort "ethod a 'e((.
pu-lic int sort=y5odel9O-,ect car*H O-,ect carA: /
//return 3*H 0 H * if car* is less thanH eBual to or greater than carA
0
149
<p:column sort=y'(./car.model0( sort6unction'(./car=ean.sort=y5odel0(
header!e&t'(5odel(>
</p:column>
...more columns
</p:data!a-le>
8u(ti&(e ortin, i enab(ed by ettin, sort-ode to multiple. In thi "odeE c(ic3in, a ort co(u"n
'hi(e "eta3ey i on add ort co(u"n to the order ,rou&.
<p:data!a-le var'(car( value'(./car=ean.cars0( sort5ode'(multiple(>
//columns
</p:data!a-le>
Data9ab(e can di&(ay data orted by de+au(tE to i"&(e"ent thi ue the sort)y o&tion o+ datatab(e
and the o&tiona( sort,rder. 9ab(e be(o' 'ou(d be initia((y di&(ayed a orted by "ode(.
<p:data!a-le var'(car( value'(./car=ean.cars0( sort=y'(./car.model0(>
<p:column sort=y'(./car.model0( header!e&t'5odel>
</p:column>
<p:column sort=y'(./car.year0( header!e&t'("ear(>
</p:column>
...more columns
</p:data!a-le>
Filterin&
A/a0 baed +i(terin, i enab(ed by ettin, filter)y at co(u"n (eve( and &rovidin, a (it to 3ee& the
+i(tered ub(it. It i u,,eted to ue a co&e (on,er than reCuet (i3e vie'co&e to 3ee& the
+i(tered>a(ue o that +i(tered (it i ti(( acceib(e a+ter +i(terin,.
<p:data!a-le var'(car( value'(./car=ean.cars0(
filtered@alue'(./car=ean.filteredars0(>
<p:column filter=y'(./car.model0( header!e&t'(5odel(>
</p:column>
...more columns
</p:data!a-le>
#i(terin, i tri,,ered 'ith 3eyu& event and +i(ter in&ut can be ty(ed uin, filterStyleE
filterStyleClass attribute. I+ youd (i3e to ue a dro&do'n intead o+ an in&ut +ie(d to on(y a((o'
&rede+ined +i(ter va(ue ue filter,ptions attribute and a co((ectionQarray o+ e(ectite" a va(ue. In
additionE filter-atch-ode de+ine the bui(tBin "atcher 'hich i starts5ith by de+au(t.
#o((o'in, i a baic +i(terin, datatab(e 'ith thee o&tion de"ontratedK
150
<p:data!a-le var'(car( value'(./car=ean.cars0(
filtered@alue'(./car=ean.filteredars0( widget@ar'(cars!a-le(>
<p:output#anel>
<h:output!e&t value'(8earch all fields:( />
<h:input!e&t id'(glo-al6ilter( on2eyup'(#69?cars!a-le?:.filter9:( />
</p:output#anel>
</f:facet>
<p:column filter=y'(./car.model0( header!e&t'(5odel( filter5atch5ode'(contains(>
</p:column>
<p:column filter=y'(./car.year0( header!e&t'("ear( footer!e&t'(starts1ith(>
</p:column>
<p:column filter=y'(./car.manufacturer0( header!e&t'(5anufacturer(
filterOptions'(./car=ean.manufacturerOptions0( filter5atch5ode'(e&act(>
<h:output!e&t value'(./car.manufacturer0( />
</p:column>
<p:column filter=y'(./car.color0( header!e&t'(olor( filter5atch5ode'(ends1ith(>
<h:output!e&t value'(./car.color0( />
</p:column>
<p:column filter=y'(./car.price0( header!e&t'(#rice( filter5atch5ode'(e&act(>
<h:output!e&t value'(./car.price0( />
</p:column>
</p:data!a-le>
#i(ter (ocated at header i a ,(oba( one a&&(yin, on a(( +ie(dE thi i i"&(e"ented by ca((in, c(ient
ide A!I "ethod ca((ed filter!6 i"&ortant &art i to &eci+y the id o+ the in&ut te0t a globalFilter
'hich i a reerved identi+ier +or datatab(e.
In addition to de+au(t +i(terin, 'ith ,enerated e(e"entE cuto" e(e"ent can a(o be ued a a +i(ter
+acet. E0a"&(e be(o' ue cuto" +i(ter co"&onent in co"bination 'ith ,enerated e(e"ent.
When a cuto" co"&onent i ued a a +i(ter +acetE +i(terin, need to be ca((ed "anua((y +ro" a
&re+erred event uch a onchan,ePI!#?Ocar9ab(eO@.+i(ter?@I. A(o de+inin, a converter "i,ht be
neceary i+ the va(ue o+ the +i(ter +acet i not de+ined.
151
<p:data!a-le id'(data!a-le( var'(car( value'(./ta-le=ean.cars8mall0(
widget@ar'(cars!a-le( filtered@alue'(./ta-le=ean.filteredars0(>

<p:column id'(modelolumn( filter=y'(./car.model0( header!e&t'(5odel(
footer!e&t'(contains( filter5atch5ode'(contains(>
</p:column>

<p:column id'(yearolumn( filter=y'(./car.year0( header!e&t'("ear(
footer!e&t'(lte( filter5atch5ode'(lte(>
<f:facet name'(filter(>
<p:spinner onchange'(#69?cars!a-le?:.filter9:( min'(*+U0( ma&'(A0*0(>
<f:converter converterId'(,ava&.faces.Integer( />
</p:spinner>
</f:facet>
</p:column>

<p:column id'(manufacturerolumn( filter=y'(./car.manufacturer0(
header!e&t'(5anufacturer( footer!e&t'(e&act( filter5atch5ode'(e&act(>
<p:selectOne5enu onchange'(#69?cars!a-le?:.filter9:( >
<f:selectItems value'(./ta-le=ean.manufacturerOptions0( />
</p:selectOne5enu>
</f:facet>
</p:column>

<p:column id'(colorolumn( filter=y'(./car.color0( header!e&t'(olor(
footer!e&t'(in( filter5atch5ode'(in(>
<p:selecthec2-o&5enu la-el'(olors(
onchange'(#69?cars!a-le?:.filter9:(>
<f:selectItems value'(./ta-le=ean.colors0( />
</p:selecthec2-o&5enu>
</f:facet>
</p:column>
<p:column id'(soldolumn( filter=y'(./car.sold0( header!e&t'(8tatus(
footer!e&t'(eBuals( filter5atch5ode'(eBuals(>
<p:selectOne=utton onchange'(#69?cars!a-le?:.filter9:(>
<f:converter converterId'(,ava&.faces.=oolean( />
<f:selectItem item7a-el'(<ll( item@alue'(( />
<f:selectItem item7a-el'(8old( item@alue'(true( />
<f:selectItem item7a-el'(8ale( item@alue'(false( />
</p:selectOne=utton>
</f:facet>
<h:output!e&t value'(./car.sold M ?8old?: ?8ale?0( />
</p:column>
</p:data!a-le>
152
+i(ter8atch8ode de+ine 'hich bui(tBin +i(terin, a(,orith" 'ou(d be ued &er co(u"nE va(id va(ue
+or thi attribute areK
B starts1it"N *hec3 i+ co(u"n va(ue tart 'ith the +i(ter va(ue.
B ends1it"N *hec3 i+ co(u"n va(ue end 'ith the +i(ter va(ue.
B containsN *hec3 i+ co(u"n va(ue contain the +i(ter va(ue.
B e$actN *hec3 i+ trin, re&reentation o+ co(u"n va(ue and +i(ter va(ue are a"e.
B ltN *hec3 i+ co(u"n va(ue i (e than the +i(ter va(ue.
B lteN *hec3 i+ co(u"n va(ue i (e than or eCua( the +i(ter va(ue.
B gtN *hec3 i+ co(u"n va(ue i ,reater than the +i(ter va(ue.
B gteN *hec3 i+ co(u"n va(ue i ,reater than or eCua( the +i(ter va(ue.
B e2ualsN *hec3 i+ co(u"n va(ue eCua( the +i(ter va(ue.
B inN *hec3 i+ co(u"n va(ue i in the co((ection o+ the +i(ter va(ue.
In cae the bui(tBin "ethod do not u++iceE cuto" +i(terin, can be i"&(e"ented uin,
+i(ter#unction a&&roach.
<p:column filter=y'(./car.price0( filter6unction'(./ta-le=ean.filter=y#rice0(>
<h:output!e&t value'(./car.price0(>
<f:convertJum-er currency8ym-ol'(V( type'(currency(/>
</h:output!e&t>
</p:column>
filterFunction hou(d be a "ethod 'ith three &ara"eterK co(u"n va(ueE +i(ter va(ue and (oca(e.
Return va(ue i a boo(eanE true acce&t the va(ue and +a(e re/ect it.
pu-lic -oolean filter=y#rice9O-,ect valueH O-,ect filterH 7ocale locale: /
//return true or false
0
6oca(e i &rovided a o&tiona( in cae you need to ue a (oca(e a'are "ethod (i3e
to&owerCase&ocale locale!. <ote that Strin, baed +i(ter (i3e tartWithE endWith ue
to6o'er*ae a(ready and data&ocale attribute i ued to &rovide the (oca(e to ue 'hen +i(terin,.
"ow Selection
9here are evera( 'ay to e(ect ro'?@ +ro" datatab(e. 6et be,in by addin, a *ar re+erence +or
in,(e e(ection and a *ar array +or "u(ti&(e e(ection to the *ar1ean to ho(d the e(ected data.
private ar selectedar;
private arQS selectedars;
pu-lic ar=ean9: /
//populate cars
0
0
Sin,(e Se(ection 'ith a *o""and *o"&onent
9hi "ethod i i"&(e"ented 'ith a co""and co"&onent uch a co""and6in3 or
co""and1utton. Se(ected ro' can be et to a erver ide intance by &ain, a a &ara"eter i+ you
are uin, E6 %.% or uin, +Net!ro&ertyAction6itener.
153
<p:column>
<p:command=utton value'(8elect(>
<f:set#roperty<ction7istener value'(./car0(
target'(./car=ean.selectedar0( />
</p:command=utton>
</p:column>
...columns
</p:data!a-le>
Sin,(e Se(ection 'ith Ro' *(ic3
!reviou "ethod 'or3 'hen the button i c(ic3edE i+ youd (i3e to enab(e e(ection 'herever the
ro' i c(ic3edE ue selection-ode o&tion.
<p:data!a-le var'(car( value'(./car=ean.cars0( selection5ode'(single(
selection'(./car=ean.selectedar0( rowTey'(./car.id0(>
...columns
</p:data!a-le>
8u(ti&(e Se(ection 'ith Ro' *(ic3
8u(ti&(e ro' e(ection i i"i(ar to in,(e e(ection but e(ection hou(d re+erence an array or a (it
o+ the do"ain ob/ect di&(ayed and uer need to ue &re "odi+ier 3ey?e.,. ctr(@ durin, e(ection J.
<p:data!a-le var'(car( value'(./car=ean.cars0( selection5ode'(multiple(
selection'(./car=ean.selectedars0( rowTey'(./car.id0( >
...columns
</p:data!a-le>
Single Selection with +adio)utton
Se(ection a ro' 'ith a radio button &(aced on each ro' i a co""on caeE datatab(e ha bui(tBin
u&&ort +or thi "ethod o that you dont need to dea( 'ith hNe(ect7neRadio and (o' (eve( bit. In
order to enab(e thi +eatureE de+ine a co(u"n 'ith selection-ode et a in,(e.
<p:data!a-le var'(car( value'(./car=ean.cars0( selection'(./car=ean.selectedar0(
rowTey'(./car.id0(>
<p:column selection5ode'(single(/>
...columns
</p:data!a-le>
-ultiple Selection with Chec"bo$es
Si"i(ar to ho' radio button are enab(edE de+ine a e(ection co(u"n 'ith a "u(ti&(e e(ection8ode.
Data9ab(e 'i(( a(o &rovide a e(ectA(( chec3bo0 at co(u"n header.
<p:data!a-le var'(car( value'(./car=ean.cars0( selection'(./car=ean.selectedars0(
rowTey'(./car.id0( >
<p:column selection5ode'(multiple(/>
...columns
</p:data!a-le>
154
J Ue ro0)elect!ode o&tion to cuto"i=e the de+au(t behavior on ro' c(ic3 o+ a "u(ti&(e
e(ection enab(ed datatab(e. De+au(t va(ue i Ine'I that c(ear &reviou e(ection and IaddI
"ode 3ee& &reviou e(ection a"e a e(ectin, a ro' 'ith "oue c(ic3 'hen "eta3ey i on.
"ow@ey
Ro';ey hou(d a uniCue identi+ier +ro" your data "ode( and ued by datatab(e to +ind the e(ected
ro'. Mou can either de+ine thi 3ey by uin, the ro';ey attribute or by bindin, a data "ode(
'hich i"&(e"ent org.primefaces.model.Selectable'ata-odel.
Dynamic $olumns
Dyna"ic co(u"n i handy in cae you cant 3no' ho' "any co(u"n to render. *o(u"n
co"&onent i ued to de+ine the co(u"n &ro,ra""atica((y. It reCuire a co((ection a the va(ueE t'o
iterator variab(e ca((ed var and column*nde$2ar.
<p:data!a-le var'(cars( value'(./ta-le=ean.cars0(>
<p:columns value'(./ta-le=ean.columns0( var'(column(
sort=y'(./column.property0( filter=y'(./column.property0(>
./column.header0
</f:facet>
<h:output!e&t value'(./carsQcolumn.propertyS0( />
</p:columns>
</p:data!a-le>
155
private 7ist<olumn5odel> columns ' new <rray7ist<olumn5odel>9:;
pu-lic ar=ean9: /
populateolumns9:;
cars ' //populate cars;
0
pu-lic void populateolumns9: /
8tringQS columnTeys ' new 8tringQS/(model(H(year(H(color(0;

for98tring columnTey : columnTeys: /
columns.add9new olumn5odel9columnTey.toKpperase9:H columnTey::;
0
0
static pu-lic class olumn5odel implements 8erialiOa-le /

private 8tring header;
private 8tring property;

pu-lic olumn5odel98tring headerH 8tring property: /
this.header ' header;
this.property ' property;
0

pu-lic 8tring get4eader9: /
return header;
0

pu-lic 8tring get#roperty9: /
return property;
0
0
0
)roupin&
Grou&in, i de+ined by *o(u"nGrou& co"&onent ued to co"bine datatab(e header and +ooter.
156
<p:data!a-le var'(sale( value'(./car=ean.sales0(>
<p:columnIroup type'(header(>
<p:row>
<p:column rowspan'()( header!e&t'(5anufacturer( />
<p:column colspan'(E( header!e&t'(8ales( />
</p:row>
<p:row>
<p:column colspan'(A( header!e&t'(8ales ount( />
<p:column colspan'(A( header!e&t'(#rofit( />
</p:row>
<p:row>
<p:column header!e&t'(7ast "ear( />
<p:column header!e&t'(!his "ear( />
<p:column header!e&t'(7ast "ear( />
<p:column header!e&t'(!his "ear( />
</p:row>
</p:columnIroup>
<p:column>
./sale.manufacturer0
</p:column>
<p:column>
./sale.last"ear#rofit0F
</p:column>
<p:column>
./sale.this"ear#rofit0F
</p:column>
<p:column>
./sale.last"ear8ale0V
</p:column>
<p:column>
./sale.this"ear8ale0V
</p:column>
<p:columnIroup type'(footer(>
<p:row>
<p:column colspan'()( style'(te&t3align:right( footer!e&t'(!otals:(/>
<p:column footer!e&t'(./ta-le=ean.last"ear!otal0V( />
<p:column footer!e&t'(./ta-le=ean.this"ear!otal0V( />
</p:row>
</p:columnIroup>

</p:data!a-le>
private 7ist<8ale> sales;
pu-lic ar=ean9: /
sales ' //create a list of =rand8ale o-,ects
0
pu-lic 7ist<8ale> get8ales9: /
return this.sales;
0
0
157
Scrollin&
Scro((in, "a3e the headerB+ooter o+ the tab(e +i0ed and the body &art cro((ab(e. scrollable attribute
"ut be enab(ed and de&endin, on the cro((in, orientationE scroll.eight andQor scroll5idth o&tion
"ut be &eci+ied.
<p:data!a-le var'(car( value'(./-ean.data0( scrolla-le'(true( scroll4eight'(*50(>
<p:column />
//columns
</p:data!a-le>
Si"&(e cro((in, render a(( data to c(ient 'herea (ive cro((in, i ue+u( to dea( 'ith hu,e dataE in
thi cae data i +etched 'henever the cro((bar reache botto". Set liveScroll to enab(e thi o&tionK
<p:data!a-le var'(car( value'(./-ean.data0( scrolla-le'(true( scroll4eight'(*50(
live8croll'(true(>
<p:column />
//columns
</p:data!a-le>
Scro((in, ha ) "odeK 0E y and 0By cro((in, that are de+ined by scroll.eight and scroll5idth.
9hee t'o cro(( attribute can be de+ined uin, inte,er va(ue indicatin, +i0ed &i0e( or &ercenta,e
re(ative to the container di"enion.
Fro9en "ows
*ertain ro' can be +i0ed in a cro((ab(e tab(e by uin, the fro/en+ows attribute that de+ine the
nu"ber o+ ro' to +ree=e +ro" the tart.
<p:data!a-le var'(car( value'(./-ean.data0( scrolla-le'(true( scroll4eight'(*50(
froOenCows'(A(>
<p:column />
//columns
</p:data!a-le>
Fro9en $olumns
S&eci+ic co(u"n can be +i0ed 'hi(e the ret o+ the" re"ain a cro((ab(e. fro/enColumns de+ine
the nu"ber o+ co(u"n to +ree=e +ro" the tart.
158
<p:data!a-le var'(car( value'(./-ean.data0( scrolla-le'(true( scroll1idth'(A00(
froOenolumns'(A(>
<p:column />
//columns
</p:data!a-le>
/-pandable "ows
+owToggler and +owE$pansion +acet are ued to i"&(e"ent e0&andab(e ro'.
$&pand rows to see detailed information
</f:facet>
<p:column>
<p:row!oggler />
</p:column>
//columns
<p:row$&pansion>
//Detailed content of a car
</p:row$&pansion>
</p:data!a-le>
&Nro'9o,,(er co"&onent &(ace an e0&andQco((a&e iconE c(ic3in, on a co((a&ed ro' (oad
e0&anded content 'ith a/a0. I+ you need to di&(ay a ro' a e0&anded by de+au(tE ue e$panded+ow
attribute 'hich i eva(uated be+ore renderin, o+ each ro' o va(ue e0&reion are u&&orted.
Additiona((yE ro'E0&and8ode attribute de+ine i+ "u(ti&(e ro' can be e0&anded at the a"e ti"e
or notE va(id va(ue are Iin,(eI and I"u(ti&(eI ?de+au(t@.
/ditin&
Ince(( editin, &rovide an eay 'ay to di&(ay editab(e data. p7cellEditor i ued to de+ine the ce((
editor o+ a &articu(ar co(u"n. 9here are t'o ty&e o+ editin,E row and cell. Ro' editin, i the
de+au(t "ode and ued by addin, a p7rowEditor co"&onent a ro' contro(.
159
<p:data!a-le var'(car( value'(./car=ean.cars0( edita-le'(true(>
In3ell $diting
</f:facet>
<p:column header!e&t'(5odel(>
<p:cell$ditor>
<f:facet name'(output(>
</f:facet>
<f:facet name'(input(>
<h:input!e&t value'(./car.model0(/>
</f:facet>
</p:cell$ditor>
</p:column>
//more columns with cell editors
<p:column>
<p:row$ditor />
</p:column>
</p:data!a-le>
When &enci( icon i c(ic3edE ro' i di&(ayed in editab(e "ode "eanin, in&ut +acet are di&(ayed
and out&ut +acet are hidden. *(ic3in, tic3 icon on(y ave that &articu(ar ro' and cance( icon
revert the chan,eE both o&tion are i"&(e"ented 'ith a/a0 interaction.
Another o&tion +or ince(( editin, i ce(( editin,E in thi "ode a ce(( 'itche to edit "ode 'hen it i
c(ic3edE (oin, +ocu tri,,er an a/a0 event to ave the chan,e va(ue.
*a9y *oadin&
6a=y 6oadin, i an a&&roach to dea( 'ith hu,e dataet e++icient(yE re,u(ar a/a0 baed &a,ination
'or3 by renderin, on(y a &articu(ar &a,e but ti(( reCuire a(( data to be (oaded into "e"ory. 6a=y
(oadin, datatab(e render a &articu(ar &a,e i"i(ar(y but a(o on(y (oad the &a,e data into "e"ory
not t he 'ho( e dat aet . In order t o i "&( e"ent t hi E youd n e e d t o b i n d a
org.primefaces.model.&a/y'ata-odel a the va(ue and i"&(e"ent load "ethod and enab(e la/y
o&tion. A(o it i reCuired to i"&(e"ent get+ow'ata and get+ow8ey i+ you have e(ection enab(ed.
160
<p:data!a-le var'(car( value'(./car=ean.model0( paginator'(true( rows'(*0(
laOy'(true(>
//columns
</p:data!a-le>
private 7aOyData5odel model;
pu-lic ar=ean9: /
model ' new 7aOyData5odel9: /
ZOverride
pu-lic void load9int firstH int page8iOeH 8tring sort6ieldH
8ortOrder sortOrderH 5ap<8tringHO-,ect> filters: /
//load physical data
0
0;
int totalCowount ' //logical row count -ased on a count Buery
model.setCowount9totalCowount:;
0
pu-lic 7aOyData5odel get5odel9: /
return model;
0
0
Data9ab(e ca(( your (oad i"&(e"entation 'henever a &a,in,E ortin, or +i(terin, occur 'ith
+o((o'in, &ara"eterK
G +irtN 7++et o+ +irt data to tart +ro"
G &a,eSi=eN <u"ber o+ data to (oad
G ort#ie(dN <a"e o+ ort +ie(d
G ort7rderN Sort7rder enu".
G +i(terN #i(ter "a& 'ith +ie(d na"e a 3ey ?e.,. I"ode(I +or +i(ter1yPIXVcar."ode(WI@ and va(ue.
In addition to (oad "ethodE tota(Ro'*ount need to be &rovided o that &a,inator can di&(ay ite(+
accordin, to the (o,ica( nu"ber o+ ro' to di&(ay.
It i u,,eted to ue field attribute o+ co(u"n co"&onent to de+ine the +ie(d na"e &aed a
ort#ie(d and +i(ter#ie(dE other'ie thee +ie(d 'ou(d be tried to ,et e0tracted +ro" the va(ue
e0&reion 'hich i not &oib(e in cae (i3e co"&oite co"&onent.
Stic+y (eader
Stic3y .eader +eature "a3e the datatab(e header viib(e on &a,e cro((in,.
<p:data!a-le var'(car( value'(./car=ean.model0( stic2y4eader'(true(>
//columns
</p:data!a-le>
161
Summary"ow
Su""ary i a he(&er co"&onent to di&(ay a u""ary +or the ,rou&in, 'hich i de+ined by the
ort1y o&tion.
162
<p:data!a-le var'(car( value'(./ta-le=ean.cars0(>
./car.model0
</p:column>
<p:column header!e&t'("ear( sort=y'(year(>
./car.year0
</p:column>
<p:column header!e&t'(5anufacturer( sort=y'(manufacturer(>
./car.manufacturer0
</p:column>
<p:column header!e&t'(olor( sort=y'(color(>
./car.color0
</p:column>

<p:summaryCow>
<p:column colspan'()( style'(te&t3align:right(>
!otal:
</p:column>

<p:column>
./ta-le=ean.random#rice0V
</p:column>
</p:summaryCow>
</p:data!a-le>
Sub1able
Sub9ab(e i a he(&er co"&onent to di&(ay neted co((ection. E0a"&(e be(o' di&(ay a co((ection
o+ &(ayer and a ubtab(e +or the tat co((ection o+ each &(ayer.
163
<p:data!a-le var'(player( value'(./ta-le=ean.players0(>
6= 8tatistics
</f:facet>
<p:columnIroup type'(header(>
<p:row>
<p:column rowspan'(A( header!e&t'(#layer( />
<p:column colspan'(A( header!e&t'(8tats( />
</p:row>

<p:row>
<p:column header!e&t'(Ioals( />
<p:column header!e&t'(<ssists( />
</p:row>
</p:columnIroup>
<p:su-!a-le var'(stats( value'(./player.stats0(>
./player.name0
</f:facet>

<p:column>
./stats.season0
</p:column>

<p:column>
./stats.goals0
</p:column>

<p:column>
./stats.assists0
</p:column>

<p:columnIroup type'(footer(>
<p:row>
<p:column footer!e&t'(!otals: ( style'(te&t3align:right(/>
<p:column footer!e&t'(./player.allIoals0( />
<p:column footer!e&t'(./player.all<ssists0( />
</p:row>
</p:columnIroup>
</p:su-!a-le>
</p:data!a-le>
164
$olumn 1o&&ler
>iib(e co(u"n o+ a tab(e can be to,,(ed uin, the co(u"n to,,(er he(&er co"&onent.
7ist of ars
<p:command=utton id'(toggler( type'(-utton( value'(olumns(
style'(float:right( icon'(ui3icon3calculator( />
<p:column!oggler datasource'(cars( trigger'(toggler( />
</f:facet>
./car.model0
</p:column>
<p:column header!e&t'("ear( sort=y'(year(>
./car.year0
</p:column>
<p:column header!e&t'(5anufacturer( sort=y'(manufacturer(>
./car.manufacturer0
</p:column>
<p:column header!e&t'(olor( sort=y'(color(>
./car.color0
</p:column>
</p:data!a-le>
7n &a,e (oadE co(u"n chooer +ind a(( co(u"n o+ datatab(e and ,enerate the ui. I+ youOd (i3e
o"e o+ the co(u"n to be i,noredE et toggleable o&tion o+ a co(u"n a +a(e. 7&tiona( toggle a/a0
behavior i &rovided by co(u"n*hooer co"&onent to (iten to to,,(e event at erver ide. 6itener
o+ thi behavior ,et an org.primefaces.event.ToggleEvent a a &ara"eter that ,ive the viibi(ity
and inde0 o+ the co(u"n bein, to,,(ed.
"eorderin& "ows
Ro' o+ the tab(e can be reordered uin, dra,:dro&. Set dra,,ab(eRo' attribute to true to enab(e
thi +eature.
7&tiona( row+eorder a/a0 behavior i &rovided to (iten to reorder event at erver ide. 6itener o+
thi behavior ,et an org.primefaces.event.+eorderEvent a a &ara"eter that ,ive the &at and
current inde0 o+ the ro' bein, "oved.
165
<p:data!a-le var'(car( value'(./ta-le=ean.cars0( dragga-leCows'(true(>
<p:a,a& event'(rowCeorder( listener'(./ta-le=ean.onCowCeorder0( />
./car.model0
</p:column>
//columns
</p:data!a-le>
pu-lic class !a-le=ean /
//...
pu-lic void onCowCeorder9Ceorder$vent event: /
//int from ' event.get6romInde&9:;
//int end ' event.get$ndInde&9:;
0
0
"eorderin& $olumns
*o(u"n o+ the tab(e can be reordered uin, dra,:dro& a 'e((. Set dra,,ab(e*o(u"n attribute to
true to enab(e thi +eature. 7&tiona( col+eorder a/a0 behavior i &rovided to (iten to reorder event
at erver ide.
<p:data!a-le var'(car( value'(./ta-le=ean.cars0( dragga-leolumns'(true(>
./car.model0
</p:column>
//columns
</p:data!a-le>
166
A,a- .ehaior /ents
&a,e or,.&ri"e+ace.event.data.!a,eEvent 7n &a,ination.
ort or,.&ri"e+ace.event.data.SortEvent When a co(u"n i orted.
+i(ter or,.&ri"e+ace.event.data.#i(terEvent 7n +i(terin,.
ro'Se(ect or,.&ri"e+ace.event.Se(ectEvent When a ro' i bein, e(ected.
ro'Une(ect or,.&ri"e+ace.event.Une(ectEvent When a ro' i bein, une(ected.
ro'Edit or,.&ri"e+ace.event.Ro'EditEvent When a ro' i edited.
ro'EditInit or,.&ri"e+ace.event.Ro'EditEvent When a ro' 'itche to edit "ode
ro'Edit*ance( or,.&ri"e+ace.event.Ro'EditEvent When ro' edit i cance((ed.
co(Rei=e or,.&ri"e+ace.event.*o(u"nRei=eEvent When a co(u"n i bein, e(ected.
to,,(eSe(ect or,.&ri"e+ace.event.9o,,(eSe(ectEvent When header chec3bo0 i to,,(ed.
co(Reorder B When co(u"n are reordered.
ro'Se(ectRadio or,.&ri"e+ace.event.Se(ectEvent Ro' e(ection 'ith radio.
ro'Se(ect*hec3bo0 or,.&ri"e+ace.event.Se(ectEvent Ro' e(ection 'ith chec3bo0.
ro'Une(ect*hec3bo0 or,.&ri"e+ace.event.Une(ectEvent Ro' une(ection 'ith chec3bo0.
ro'Db(e(ect or,.&ri"e+ace.event.Se(ectEvent Ro' e(ection 'ith doub(e c(ic3.
ro'9o,,(e or,.&ri"e+ace.event.9o,,(eEvent Ro' e0&and or co((a&e.
conte0t8enu or,.&ri"e+ace.event.Se(ectEvent *onte0t8enu di&(ay.
ce((Edit or,.&ri"e+ace.event.*e((EditEvent When a ce(( i edited.
ro'Reorder or,.&ri"e+ace.event.ReorderEvent 7n ro' reorder.
#or e0a"&(eE datatab(e be(o' "a3e an a/a0 reCuet 'hen a ro' i e(ected 'ith a c(ic3 on ro'.
<p:data!a-le var'(car( value'(./car=ean.model0(>
<p:a,a& event'row8elect update'anotherLcomponent />
//columns
</p:data!a-le>
167
$lient Side API
Wid,etN PrimeFaces.widget.'ataTable
,et!a,inator?@ B !a,inator Return the &a,inator inance.
c(ear#i(ter?@ B void *(ear a(( co(u"n +i(ter
,etSe(ectedRo'*ount?@ <u"ber Return nu"ber o+ e(ected ro'.
e(ectRo'?rE i(ent@ rN nu"ber or tr
e(e"ent a /Duery
ob/ectE
silentN +(a, to +ire ro'
e(ect a/a0 behavior
void Se(ect the ,iven ro'.
une(ectRo'?rE i(ent@ rN nu"ber or tr
e(e"ent a /Duery
ob/ectE
silentN +(a, to +ire ro'
e(ect a/a0 behavior
void Une(ect the ,iven ro'.
une(ectA((Ro'?@ 1 void Une(ect a(( ro'.
to,,(e*hec3A((?@ 1 void 9o,,(e header chec3bo0 tate.
+i(ter?@ 1 >oid #i(ter the data.
e(ectA((Ro'?@ 1 void Se(ect a(( ro'.
e(ectA((Ro'7n!a,e?@ 1 void Se(ect a(( ro' on current &a,e.
une(ectA((Ro'7n!a,e?@ 1 void Une(ect a(( ro' on current &a,e.
168
S+innin&
Data9ab(e reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. A 3innin,
#lass Applies
.uiBdatatab(e 8ain container e(e"ent
.uiBdatatab(eBdata 9ab(e body
.uiBdatatab(eBe"&tyB"ea,e E"&ty "ea,e ro'
.uiBdatatab(eBheader 9ab(e header
.uiBdatatab(eB+ooter 9ab(e +ooter
.uiBortab(eBco(u"n Sortab(e co(u"n
.uiBortab(eBco(u"nBicon Icon o+ a ortab(e icon
.uiBe0&andedBro'Bcontent *ontent o+ an e0&anded ro'
.uiBro'Bto,,(er Ro' to,,(er +or ro' e0&anion
.uiBeditab(eBco(u"n *o(u"n 'ith a ce(( editor
.uiBce((Beditor *ontainer o+ in&ut and out&ut contro( o+ an editab(e ce((
.uiBce((BeditorBin&ut *ontainer o+ in&ut contro( o+ an editab(e ce((
.uiBce((BeditorBout&ut *ontainer o+ out&ut contro( o+ an editab(e ce((
.uiBdatatab(eBeven Even nu"bered ro'
.uiBdatatab(eBodd 7dd nu"bered ro'
.uiBdatatab(eBcro((ab(e 8ain container e(e"ent o+ a cro((ab(e tab(e.
.uiBdatatab(eBcro((ab(eBheader .eader 'ra&&er o+ a cro((ab(e tab(e.
.uiBdatatab(eBcro((ab(eBheaderBbo0 .eader container o+ a cro((ab(e tab(e.
.uiBdatatab(eBcro((ab(eBbody 1ody container o+ a cro((ab(e tab(e.
.uiBdatatab(eBcro((ab(eB+ooter #ooter 'ra&&er o+ a cro((ab(e tab(e.
.uiBdatatab(eBcro((ab(eB+ooterBbo0 #ooter container o+ a cro((ab(e tab(e.
.uiBdatatab(eBrei=ab(e 8ain container e(e"ent o+ a rei=ab(e tab(e.
169
#.#1 De%ault$ommand
Which co""and to ub"it the +or" 'ith 'hen enter 3ey i &reed a co""on &rob(e" in 'eb a&&
not /ut &eci+ic to AS#. 1ro'er tend to behave di++erent(y a there doent ee" to be a tandard
and even i+ a tandard e0itE IE &robab(y 'i(( not care about it. 9here are o"e u,(y 'or3around
(i3e &(acin, a hidden button and 'ritin, /avacri&t +or every +or" in your a&&. De+au(t*o""and
o(ve thi &rob(e" by nor"a(i=in, the co""and?e.,. button or (in3@ to ub"it the +or" 'ith on
enter 3ey &re.
In%o
9a, default#ommand
*o"&onent *(a org.primefaces.component.defaultcommand.Default#ommand
*o"&onent 9y&e org.primefaces.component.Default#ommand
Renderer 9y&e org.primefaces.component.Default#ommandenderer
Renderer *(a org.primefaces.component.defaultcommand.Default#ommandenderer
Attributes
rendered.
tar,et nu(( Strin, Identi+ier o+ the de+au(t co""and co"&onent.
co&e nu(( Strin, Identi+ier o+ the ancetor co"&onent to enab(e
"u(ti&(e de+au(t co""and in a +or".
)ettin& Started with the De%ault$ommand
De+au(t*o""and "ut be neted inide a +or" reCuire target o&tion to re+erence a c(ic3ab(e
co""and. E0a"&(e be(o' tri,,er btn9 'hen enter 3ey i &reed. <ote that an in&ut "ut have
+ocued due to bro'er nature.
170
<h:form id'(form(>

<h:panelIrid columns'()( cellpadding'(5(>
<h:output7a-el for'(name( value'(Jame:( style'(font3weight:-old(/>
<p:input!e&t id'(name( value'(./defaultommand=ean.te&t0( />
<h:output!e&t value'(./defaultommand=ean.te&t0( id'(display( />
</h:panelIrid>

<p:command=utton value'(=utton*( id'(-tn*( action7istener'(./-ean.su-mit*0(
a,a&'(false(/>
<p:command=utton value'(=uttonA( id'(-tnA( action7istener'(./-ean.su-mitA0( />
<h:command=utton value'(=utton)( id'(-tn)( action7istener'(./-ean.su-mit)0( />

<p:defaultommand target'(-tA( />
</h:form>
Scope
I+ you need "u(ti&(e de+au(t co""and on a"e &a,e ue co&e attribute that re+er to the ancetor
co"&onent o+ the tar,et in&ut.
171
#.#2 Dialo&
Dia(o, i a &ane( co"&onent that can over(ay other e(e"ent on &a,e.
In%o
9a, dialog
*o"&onent *(a org.primefaces.component.dialog.Dialog
*o"&onent 9y&e org.primefaces.component.Dialog
Renderer 9y&e org.primefaces.component.Dialogenderer
Renderer *(a org.primefaces.component.dialog.Dialogenderer
Attributes
rendered.
header nu(( Strin, 9e0t o+ the header
dra,,ab(e true 1oo(ean S&eci+ie dra,,abi(ity
rei=ab(e true 1oo(ean S&eci+ie rei=abi(ity
"oda( +a(e 1oo(ean Enab(e "oda(ity.
viib(e +a(e 1oo(ean When enab(edE dia(o, i viib(e by de+au(t.
'idth auto Inte,er Width o+ the dia(o,
hei,ht auto Inte,er .ei,ht o+ the dia(o,
"inWidth 150 Inte,er 8ini"u" 'idth o+ a rei=ab(e dia(o,.
172
"in.ei,ht 0 Inte,er 8ini"u" hei,ht o+ a rei=ab(e dia(o,.
ty(e nu(( Strin, In(ine ty(e o+ the dia(o,.
ty(e*(a nu(( Strin, Sty(e c(a o+ the dia(o,
ho'E++ect nu(( Strin, E++ect to ue 'hen ho'in, the dia(o,
hideE++ect nu(( Strin, E++ect to ue 'hen hidin, the dia(o,
&oition nu(( Strin, De+ine 'here the dia(o, hou(d be di&(ayed
c(oab(e true 1oo(ean De+ine i+ c(oe icon hou(d be di&(ayed or not
onSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen dia(o, i
di&(ayed.
on.ide nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen dia(o, i hidden.
a&&end9o nu(( Strin, A&&end the dia(o, to the e(e"ent de+ined by the ,iven
earch e0&reion.
ho'.eader true 1oo(ean De+ine viibi(ity o+ the header content.
+ooter nu(( Strin, 9e0t o+ the +ooter.
dyna"ic +a(e 1oo(ean Enab(e (a=y (oadin, o+ the content 'ith a/a0.
"ini"i=ab(e +a(e 1oo(ean Whether a dia(o, i "ini"i=ab(e or not.
"a0i"i=ab(e +a(e 1oo(ean Whether a dia(o, i "a0i"i=ab(e or not.
c(oe7nEca&e +a(e 1oo(ean De+ine i+ dia(o, hou(d c(oe on eca&e 3ey.
+ocu nu(( Strin, De+ine 'hich co"&onent to a&&(y +ocu.
+it>ie'&ort +a(e 1oo(ean Dia(o, i=e "i,ht e0ceeed vie'&ort i+ content i bi,,er
than vie'&ort in ter" o+ hei,ht. +it>ie'&ort o&tion
auto"atica((y ad/ut hei,ht to +it dia(o, 'ithin the
vie'&ort.
)ettin& started with the Dialo&
Dia(o, i a &ane( co"&onent containin, other co"&onentE note that by de+au(t dia(o, i not viib(e.
<p:dialog>
<h:output!e&t value'(Cesistance to #rime6aces is 6utile!( />
//Other content
</p:dialog>
Show and (ide
Sho'in, and hidin, the dia(o, i eay uin, the c(ient ide a&i.
173
<p:dialog header'(4eader !e&t( widget@ar'(dlg(>//ontent</p:dialog>
<p:command=utton value'(8how( type'(-utton( onclic2'(#69?dlg?:.show9:( />
<p:command=utton value'(4ide( type'(-utton( onclic2'(#69?dlg?:.hide9:( />
/%%ects
9here are variou e++ect o&tion to be ued 'hen di&(ayin, and c(oin, the dia(o,. Ue showEffect
and hideEffect o&tion to a&&(y thee e++ectK b(indE bounceE c(i&E dro&E e0&(odeE +adeE +o(dE
hi,h(i,htE &u++E &u(ateE ca(eE ha3eE i=eE (ide and tran+er.
<p:dialog show$ffect'(fade( hide$ffect'(e&plode( ...>
//...
</p:dialog>
Position
1y de+au(t dia(o, i &oitioned at center o+ the vie'&ort and position o&tion i ued to chan,e the
(ocation o+ the dia(o,. !oib(e va(ue areK
Sin,(e trin, va(ue (i3e

center6 left6 right6 top6 bottom re&reentin, the &oition 'ithin
vie'&ort.
*o""a e&arated 0 and y coordinate va(ue (i3e

9::6 ;::
*o""a e&arated &oition va(ue (i3e

top6right. ?Ue in,(e Cuote 'hen uin, a co"bination@
So"e e0a"&(e are decribed be(o'K
<p:dialog position'(top( ...>
<p:dialog position'(leftHtop( ...>
<p:dialog position'(A00H50( ...>
Focus
Dia(o, a&&(ie +ocu on +irt viib(e in&ut on ho' by de+au(t 'hich i ue+u( +or uer +riend(ine
ho'ever in o"e cae thi i not deirab(e. Au"e the +irt in&ut i a &o&u& ca(endar and o&enin,
the dia(o, ho' a &o&u& ca(endar. 9o cuto"i=e de+au(t +ocu behaviorE ue +ocu attribute.
A,a- .ehaior /ents
close event i one o+ the a/a0 behavior event &rovided by dia(o, that i +ired 'hen the dia(o, i
hidden. I+ there i a (itener de+ined it(( be e0ecuted by &ain, an intance o+
org.primefaces.event.CloseEvent.
E0a"&(e be(o' add a #ace8ea,e 'hen dia(o, i c(oed and u&date the "ea,e co"&onent to
di&(ay the added "ea,e.
174
<p:dialog>
<p:a,a& event'(close( listener'(./dialog=ean.handlelose0( update'(msg( />
//ontent
</p:dialog>
<p:messages id'(msg( />
pu-lic class Dialog=ean /
pu-lic void handlelose9lose$vent event: /
//<dd facesmessage
0
0
9'o other a/a0 behavior event are ma$imi3e and minimi3e that are invo3ed 'hen dia(o, i
"a0i"i=ed or "ini"i=ed.
Si"i(ar to c(oe (itenerE onSho' and on.ide are handy ca((bac3 +or c(ient ide in cae you need to
e0ecute cuto" /avacri&t.
<p:dialog on8how'(alert9!@isi-le:( on4ide'(alert9!4idden:(>
//ontent
</p:dialog>
$lient Side API
Wid,etN PrimeFaces.widget.'ialog
ho'?@ B void Di&(ay dia(o,.
hide?@ B void *(oe dia(o,.
S+innin&
Dia(o, reide in a "ain container e(e"ent 'hich styleClass o&tion a&&(y. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBdia(o, *ontainer e(e"ent o+ dia(o,
.uiBdia(o,Btit(ebar 9it(e bar
.uiBdia(o,Btit(eBdia(o, .eader te0t
.uiBdia(o,Btit(ebarBc(oe *(oe icon
.uiBdia(o,Bcontent Dia(o, body
175
1ips
G Ue a&&end9o 'ith care a the &a,e de+inition and ht"( do" 'ou(d be di++erentE +or e0a"&(e i+
dia(o, i inide an hN+or" co"&onent and a&&end9o1ody i enab(edE on the bro'er dia(o, 'ou(d
be outide o+ +or" and "ay caue une0&ected reu(t. In thi caeE net a +or" inide a dia(o,.
G Do not &(ace dia(o, inide tab(eE container (i3e div 'ith re(ative &oitionin, or 'ith nonB
viib(e over+(o' de+inedE in cae (i3e thee +unctiona(ity "i,ht be bro3en. 9hi i not a (i"itation
but a reu(t o+ D78 "ode(. #or e0a"&(e dia(o, inide a (ayout unitE tabvie'E accordion are a
cou&(e o+ e0a"&(e. Sa"e a&&(ie to con+ir"Dia(o, a 'e((.
176
#.## Dra&ADrop
Dra,:Dro& uti(itie o+ !ri"e#ace conit o+ t'o co"&onentK Dra,,ab(e and Dro&&ab(e.
#.##.1 Dra&&able
In%o
9a, dragga&le
*o"&onent *(a org.primefaces.component.dnd.Dragga&le
*o"&onent 9y&e org.primefaces.component.Dragga&le
Renderer 9y&e org.primefaces.component.Dragga&leenderer
Renderer *(a org.primefaces.component.dnd.Dragga&leenderer
Attributes
rendered.
&ro0y +a(e 1oo(ean Di&(ay a &ro0y e(e"ent intead o+ actua( e(e"ent.
dra,7n(y +a(e 1oo(ean S&eci+ie a dra,,ab(e that cant be dro&&ed.
+or nu(( Strin, Id o+ the co"&onent to add dra,,ab(e behavior
diab(ed +a(e 1oo(ean Diab(e dra,,ab(e behavior 'hen true.
a0i nu(( Strin, S&eci+ie dra, a0iE va(id va(ue are !0 and !y.
contain"ent nu(( Strin, *ontraint dra,,in, 'ithin the boundarie o+
contain"ent e(e"ent
he(&er nu(( Strin, .e(&er e(e"ent to di&(ay 'hen dra,,in,
revert +a(e 1oo(ean Revert dra,,ab(e to it ori,ina( &oition 'hen not
dro&&ed onto a va(id dro&&ab(e
na& +a(e 1oo(ean Dra,,ab(e 'i(( na& to ed,e o+ near e(e"ent
na&8ode nu(( Strin, S&eci+ie the na& "ode. >a(id va(ue are !bothE
177
!inner and !outer.
na&9o(erance %0 Inte,er Ditance +ro" the na& e(e"ent in &i0e( to tri,,er
na&.
=inde0 nu(( Inte,er UInde0 to a&&(y durin, dra,,in,.
hand(e nu(( Strin, S&eci+ie a hand(e +or dra,,in,.
o&acity 1 Doub(e De+ine the o&acity o+ the he(&er durin, dra,,in,.
tac3 nu(( Strin, In tac3 "odeE dra,,ab(e over(a& i contro((ed
auto"atica((y uin, the &rovided e(ectorE dra,,ed
ite" a('ay over(ay other dra,,ab(e.
,rid nu(( Strin, Dra,,in, ha&&en in every 0 and y &i0e(.
co&e nu(( Strin, Sco&e 3ey to "atch dra,,ab(e and dro&&ab(e.
curor crohair Strin, *SS curor to di&(ay in dra,,in,.
dahboard nu(( Strin, Id o+ the dahboard to connect 'ith.
)ettin& started with Dra&&able
Any co"&onent can be enhanced 'ith dra,,ab(e behaviorE baica((y thi i achieved by de+inin, the
id o+ co"&onent uin, the for attribute o+ dra,,ab(e.
<p:panel id'(pnl( header'(Dragga-le #anel(>
<h:output!e&t value'(!his is actually a regular panel( />
</p:panel>
<p:dragga-le for'(pnl(/>
I+ you o"it the +or attributeE &arent co"&onent 'i(( be e(ected a the dra,,ab(e tar,et.
<h:graphicImage id'(campnou( value'(/images/campnou.,pg(>
<p:dragga-le />
</h:graphicImage>
(andle
1y de+au(t any &oint in dra,,ed co"&onent can be ued a hand(eE i+ you need a &eci+ic hand(eE
you can de+ine it 'ith hand(e o&tion. #o((o'in, &ane( i dra,,ed uin, it header on(y.
<h:output!e&t value'(I can only -e dragged using my header( />
</p:panel>
<p:dragga-le for'(pnl( handle'(div.ui3panel3title-ar(/>
178
Dra& A-is
Dra,,in, can be (i"ited to either hori=onta((y or vertica((y.
<h:output!e&t value'(I am dragged on an a&is only( />
</p:panel>
<p:dragga-le for'(pnl( a&is'(& or y(/>
$lone
1y de+au(tE actua( co"&onent i ued a the dra, indicatorE i+ you need to 3ee& the co"&onent at it
ori,ina( (ocationE ue a c(one he(&er.
<h:output!e&t value'(I am cloned( />
</p:panel>
<p:dragga-le for'(pnl( helper'(clone(/>
"eert
When a dra,,ab(e i not dro&&ed onto a "atchin, dro&&ab(eE revert o&tion enab(e the co"&onent
to "ove bac3 to it ori,ina( &oition 'ith an ani"ation.
<h:output!e&t value'(I will -e reverted -ac2 to my original position( />
</p:panel>
<p:dragga-le for'(pnl( revert'(true(/>
;pacity
Durin, dra,,in,E o&acity o&tion can be ued to ,ive viua( +eedbac3E he(&er o+ +o((o'in, &ane(
o&acity i reduced in dra,,in,.
<h:output!e&t value'(5y opacity is lower during dragging( />
</p:panel>
<p:dragga-le for'(pnl( opacity'(0.5(/>
)rid
De+inin, a ,rid enab(e dra,,in, in &eci+ic &i0e(. 9hi va(ue ta3e a co""a e&arated di"enion
in 0Ey +or"at.
<h:output!e&t value'(I am dragged in grid mode( />
</p:panel>
<p:dragga-le for'(pnl( grid'(A0HE0(/>
179
$ontainment
A dra,,ab(e can be retricted to a certain ection on &a,eE +o((o'in, dra,,ab(e cannot ,o outide o+
it &arent.
<p:output#anel layout'(-loc2( style'(width:E00p&;height:A00p&;(>
<p:panel id'(conpnl( header'(Cestricted(>
<h:output!e&t value'(I am restricted to my parent?s -oundaries( />
</p:panel>
</p:output#anel>
<p:dragga-le for'(conpnl( containment'(parent( />
180
#.##.2 Droppable
In%o
9a, droppa&le
*o"&onent *(a org.primefaces.component.dnd.Droppa&le
*o"&onent 9y&e org.primefaces.component.Droppa&le
Renderer 9y&e org.primefaces.component.Droppa&leenderer
Renderer *(a org.primefaces.component.dnd.Droppa&leenderer
Attributes
rendered.
'id,et>ar nu(( Strin, >ariab(e na"e o+ the c(ient ide 'id,et
+or nu(( Strin, Id o+ the co"&onent to add dro&&ab(e behavior
diab(ed +a(e 1oo(ean Diab(e o+ enab(e dro&&ab(e behavior
hoverSty(e*(a nu(( Strin, Sty(e c(a to a&&(y 'hen an acce&tab(e dra,,ab(e i
dra,,ed over.
activeSty(e*(a nu(( Strin, Sty(e c(a to a&&(y 'hen an acce&tab(e dra,,ab(e i
bein, dra,,ed.
onDro& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a dra,,ab(e i
dro&&ed.
acce&t nu(( Strin, Se(ector to de+ine the acce&ted dra,,ab(e.
co&e nu(( Strin, Sco&e 3ey to "atch dra,,ab(e and dro&&ab(e.
to(erance nu(( Strin, S&eci+ie the interection "ode to acce&t a dra,,ab(e.
dataource nu(( Strin, Id o+ a UIData co"&onent to connect 'ith.
181
)ettin& Started with Droppable
Ua,e o+ dro&&ab(e i very i"i(ar to dra,,ab(eE dro&&ab(e behavior can be added to any co"&onent
&eci+ied 'ith the +or attribute.
<p:output#anel id'(slot( stylelass'(slot( />
<p:droppa-le for'(slot( />
(ot ty(e*(a re&reent a "a(( rectan,(e.
<style type'(te&t/css(>
.slot /
-ac2ground:.66++00;
width:UEp&;
height:+Up&;
display:-loc2;
0
</style>
I+ for attribute i o"ittedE &arent co"&onent beco"e dro&&ab(e.
<p:output#anel id'(slot( stylelass'(slot(>
<p:droppa-le />
</p:output#anel>
A,a- .ehaior /ents
drop i the on(y and de+au(t a/a0 behavior event &rovided by dro&&ab(e that i &roceed 'hen a
va(id dra,,ab(e i dro&&ed. In cae you de+ine a (itener it(( be e0ecuted by &ain, an
org.primefaces.event.'rag'rop event intance &ara"eter ho(din, in+or"ation about the dra,,ed
and dro&&ed co"&onent.
#o((o'in, e0a"&(e ho' ho' to enab(e dra,,ab(e i"a,e to be dro&&ed on dro&&ab(e.
<p:graphicImage id'(messi( value'(-arca/messiLthum-.,pg( />
<p:dragga-le for'(messi(/>
<p:output#anel id'(Oone( stylelass'(slot( />
<p:droppa-le for'(Oone(>
<p:a,a& listener'(./ddontroller.onDrop0( />
</p:droppa-le>
pu-lic void onDrop9DragDrop$vent dd$vent: /
8tring draggedId ' dd$vent.getDragId9:; //lient id of dragged component
8tring droppedId ' dd$vent.getDropId9:; //lient id of dropped component
O-,ect data ' dd$vent.getData9:; //5odel o-,ect of a datasource
0
182
onDrop
onDro& i a c(ient ide ca((bac3 that i invo3ed 'hen a dra,,ab(e i dro&&edE it ,et t'o &ara"eter
event and ui ob/ect ho(din, in+or"ation about the dra, dro& event.
<p:output#anel id'(Oone( stylelass'(slot( />
<p:droppa-le for'(Oone( onDrop'(handleDrop(/>
function handleDrop9eventH ui: /
var dragga-le ' ui.dragga-leH //dragga-le elementH a ,Duery o-,ect
helper ' ui.helperH //helper element of dragga-leH a ,Duery o-,ect
position ' ui.positionH //position of dragga-le helper
offset ' ui.offset; //a-solute position of dragga-le helper
0
DataSource
Dro&&ab(e ha &ecia( care +or data e(e"ent that e0tend +ro" UIData?e.,. datatab(eE data,rid@E in
order to connect a dro&&ab(e to acce&t data +ro" a data co"&onent de+ine dataource o&tion a the
id o+ the data co"&onent. E0a"&(e be(o' ho' ho' to dra, data +ro" data,rid and dro& onto a
dro&&ab(e to i"&(e"ent a dra,dro& baed e(ection. Dro&&ed car are di&(ayed 'ith a datatab(e.
pu-lic class !a-le=ean /
private 7ist<ar> availa-lears;
private 7ist<ar> droppedars;
pu-lic !a-le=ean9: /
availa-lears ' //populate data
0
pu-lic void onarDrop9DragDrop$vent event: /
ar car ' 99ar: dd$vent.getData9::;
droppedars.add9car:;
availa-lears.remove9car:;
0
0
183
<h:form id'(car6orm(>
<p:fieldset legend'(<vaila-lears(>
<p:dataIrid id'(availa-lears( var'(car(
value'(./ta-le=ean.availa-lears0( columns'()(>
<p:column>
<p:panel id'(pnl( header'(./car.model0( style'(te&t3align:center(>
<p:graphicImage value'(/images/cars/./car.manufacturer0.,pg( />
</p:panel>
<p:dragga-le for'(pnl( revert'(true( handle'(.ui3panel3title-ar(
stac2'(.ui3panel(/>
</p:column>
</p:dataIrid>
</p:fieldset>
<p:fieldset id'(selectedars( legend'(8elected ars( style'(margin3top:A0p&(>
<p:output#anel id'(drop<rea(>

<h:output!e&t value'(!!!Drop here!!!(
rendered'(./empty ta-le=ean.droppedars0( style'(font3siOe:AEp&;( />
<p:data!a-le var'(car( value'(./ta-le=ean.droppedars0(
rendered'(./not empty ta-le=ean.droppedars0(>
</p:column>
<p:column header!e&t'("ear(>
</p:column>
<p:column header!e&t'(5anufacturer(>
</p:column>
<p:column header!e&t'(olor(>
</p:column>
</p:data!a-le>
</p:output#anel>
</p:fieldset>
<p:droppa-le for'(selectedars( tolerance'(touch(
active8tylelass'(ui3state3highlight( datasource'(availa-lears(
onDrop'(handleDrop(/>
<p:a,a& listener'(./ta-le=ean.onarDrop0( update'(drop<rea availa-lears( />
</p:droppa-le>
</h:form>
function handleDrop9eventH ui: /
ui.dragga-le.fadeOut9!fast:; //fade out the dropped item
0
</script>
184
1olerance
9here are +our di++erent to(erance "ode that de+ine the 'ay o+ acce&tin, a dra,,ab(e.
!ode Description
+it dra,,ab(e hou(d over(a& the dro&&ab(e entire(y
interect dra,,ab(e hou(d over(a& the dro&&ab(e at (eat 50R
&ointer &ointer o+ "oue hou(d over(a& the dro&&ab(e
touch dro&&ab(e hou(d over(a& the dro&&ab(e at any a"ount
Acceptance
Mou can (i"it 'hich dra,,ab(e can be dro&&ed onto dro&&ab(e uin, co&e attribute 'hich a
dra,,ab(e a(o ha. #o((o'in, e0a"&(e ha t'o i"a,eE on(y +irt i"a,e can be acce&ted by
dro&&ab(e.
<p:graphicImage id'(messi( value'(-arca/messiLthum-.,pg( />
<p:dragga-le for'(messi( scope'(forward(/>
<p:graphicImage id'(&avi( value'(-arca/&aviLthum-.,pg( />
<p:dragga-le for'(&avi( scope'(midfield(/>
<p:output#anel id'(forwardsonly( stylelass'(slot( scope'(forward( />
<p:droppa-le for'(forwardsonly( />
S+innin&
hoverStyleClass and activeStyleClass attribute are ued to chan,e the ty(e o+ the dro&&ab(e 'hen
interactin, 'ith a dra,,ab(e.
185
#.#' Doc+
Doc3 co"&onent "i"ic the 'e(( 3no'n doc3 inter+ace o+ 8ac 7S F.
In%o
9a, doc,
*o"&onent *(a org.primefaces.component.doc,.Doc,
*o"&onent 9y&e org.primefaces.component.Doc,
Renderer 9y&e org.primefaces.component.Doc,enderer
Renderer *(a org.primefaces.component.doc,.Doc,enderer
Attributes
be rendered.
&ro,ra""atica((y
&oition botto" Strin, !oition o+ the doc3E bottom or top.
ite"Width -0 Inte,er Initia( 'idth o+ ite".
"a0Width 50 Inte,er 8a0i"u" 'idth o+ ite".
&ro0i"ity 90 Inte,er Ditance to en(ar,e.
ha(i,n center Strin, .ori=onta( a(i,n"entE
186
)ettin& started with the Doc+
A doc3 i co"&oed o+ "enuite".
<p:doc2>
<p:menuitem value'(4ome( icon'(/images/doc2/home.png( url'(.( />
<p:menuitem value'(5usic( icon'(/images/doc2/music.png( url'(.( />
<p:menuitem value'(@ideo( icon'(/images/doc2/video.png( url'(.(/>
<p:menuitem value'($mail( icon'(/images/doc2/email.png( url'(.(/>
<p:menuitem value'(7in2( icon'(/images/doc2/lin2.png( url'(.(/>
<p:menuitem value'(C88( icon'(/images/doc2/rss.png( url'(.(/>
<p:menuitem value'(4istory( icon'(/images/doc2/history.png( url'(.(/>
</p:doc2>
Position
Doc3 can be (ocated in t'o (ocationE top or bottom ?de+au(t@. #or a doc3 &oitioned at to& et
&oition to to&.
Doc+ /%%ect
When "oue i over the doc3 ite"E icon are =oo"ed in. 9he con+i,uration o+ thi e++ect i done
via the "a0Width and &ro0i"ity attribute.
Dynamic Menus
S+innin&
#o((o'in, i the (it o+ tructura( ty(e c(aeE V&oitonW can be top or bottom.
)tyle #lass Applies
.uiBdoc3BV&oitionW 8ain container.
.uiBdoc3BcontainerBV&oitionW 8enu ite" container.
.uiBdoc3Bite"BV&oitionW Each "enu ite".
187
#.#3 /ditor
Editor i an in&ut co"&onent 'ith rich te0t editin, ca&abi(itie.
In%o
9a, editor
*o"&onent *(a org.primefaces.component.editor.'ditor
*o"&onent 9y&e org.primefaces.component.'ditor
Renderer 9y&e org.primefaces.component.'ditorenderer
Renderer *(a org.primefaces.component.editor.'ditorenderer
Attributes
co"&onent.
converter nu(( *onverterQ
Strin,
cae it a tatic te0tE it "ut re+er to a converter id.
i""ediate +a(e 1oo(ean When et trueE &roce va(idation (o,ic i e0ecuted at
a&&(y reCuet va(ue &hae +or thi co"&onent.
188
E0&r
A "ethod e0&reion that re+er to a "ethod
E0&r
A "ethod e0&reion that re+er to a "ethod +or
va(idation +ai(.
contro( nu(( Strin, 6it o+ contro( to cuto"i=e too(bar.
hei,ht nu(( Inte,er .ei,ht o+ the editor.
'idth nu(( Inte,er Width o+ the editor.
diab(ed +a(e 1oo(ean Diab(e editor.
ty(e nu(( Strin, In(ine ty(e o+ the editor container.
ty(e*(a nu(( Strin, Sty(e c(a o+ the editor container.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen editor data
chan,e.
"a0(en,th nu(( Inte,er 8a0i"u" (en,th o+ the ra' in&ut.
)ettin& started with the /ditor
Rich 9e0t entered uin, the Editor i &aed to the erver uin, value e0&reion.
pu-lic class =ean /
//getter and setter
0
<p:editor value'(./-ean.te&t0( />
$ustom 1oolbar
9oo(bar o+ editor i eay to cuto"i=e uin, controls o&tionK
<p:editor value'(./-ean.te&t0( controls'(-old italic underline stri2ethrough( />
189
.ere i the +u(( (it o+ a(( avai(ab(e contro(K
G bo(d
G ita(ic
G under(ine
G tri3ethrou,h
G ubcri&t
G u&ercri&t
G +ont
G i=e
G ty(e
G co(or
G hi,h(i,ht
G bu((et
G nu"berin,
G a(i,n(e+t
G center
G a(i,nri,ht
G /uti+y
G undo
G redo
G ru(e
G i"a,e
G (in3
G un(in3
G cut
G co&y
G &ate
G &atete0t
G &rint
G ource
G outdent
G indent
G re"ove#or"at
$lient Side API
Wid,etN PrimeFaces.widget.Editor
init?@ B void Initia(i=e a (a=y editorE ubeCuent ca(( do not
reinit the editor.
ave.986?@ B void Save ht"( te0t in i+ra"e bac3 to the te0tarea.
c(ear?@ B void *(ear the te0t in editor.
enab(e?@ B void Enab(e editin,.
diab(e?@ B void Diab(e editin,.
+ocu?@ B void Add curor +ocu to edit area.
e(ectA((?@ B void Se(ect a(( te0t in editor.
,etSe(ected.986?@ B Strin, Return e(ected te0t a .986.
,etSe(ected9e0t?@ B Strin, Return e(ected te0t in &(ain +or"at.
190
S+innin&
#o((o'in, i the (it o+ tructura( ty(e c(ae.
)tyle #lass Applies
.uiBeditor 8ain container.
.uiBeditorBtoo(bar 9oo(bar o+ editor.
.uiBeditorB,rou& 1utton ,rou&.
.uiBeditorBbutton Each button.
.uiBeditorBdivider Divider to e&arate button.
.uiBeditorBdiab(ed Diab(ed editor contro(.
.uiBeditorB(it Dro&do'n (it.
.uiBeditorBco(or *o(or &ic3er.
.uiBeditorB&o&u& !o&u& over(ay.
.uiBeditorB&ro"&t 7ver(ay to &rovide in&ut.
.uiBeditorB"ea,e 7ver(ay di&(ayin, a "ea,e.
Editor i not inte,rated 'ith 9he"eRo((er a there i on(y one icon et +or the contro(.
191
#.#5 /%%ect
E++ect co"&onent i baed on the /Duery UI e++ect (ibrary.
In%o
9a, effect
9a, *(a org.primefaces.component.effect.'ffectTag
*o"&onent *(a org.primefaces.component.effect.'ffect
*o"&onent 9y&e org.primefaces.component.'ffect
Renderer 9y&e org.primefaces.component.'ffectenderer
Renderer *(a org.primefaces.component.effect.'ffectenderer
Attributes
rendered 1 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the
be rendered.
e++ect nu(( Strin, <a"e o+ the c(ient ide 'id,et.
event nu(( Strin, Do" event to attach the event that e0ecute the
ani"ation
ty&e nu(( Strin, S&eci+ie the na"e o+ the ani"ation
+or nu(( Strin, *o"&onent that i ani"ated
&eed 1000 Inte,er S&eed o+ the ani"ation in "
de(ay nu(( Inte,er 9i"e to 'ait unti( runnin, the e++ect.
)ettin& started with /%%ect
E++ect co"&onent need a tri,,er and tar,et 'hich i e++ect &arent by de+au(t. In e0a"&(e be(o'
c(ic3in, out&ut9e0t ?tri,,er@ 'i(( run the &u(ate e++ect on out&ut9e0t?tar,et@ ite(+.
192
<h:output!e&t value'(./-ean.value0(>
<p:effect type'(pulsate( event'(clic2( />
</h:output!e&t>
/%%ect 1ar&et
9here "ay be cae 'here you 'ant to di&(ay an e++ect on another tar,et on the a"e &a,e 'hi(e
3ee&in, the &arent a the tri,,er. Ue for o&tion to &eci+y a tar,et.
<h:output7in2 id'(ln2( value'(.(>
<h:output!e&t value'(8how the =arca !emple( />
<p:effect type'(appear( event'(clic2( for'(img( />
</h:output7in2>
<p:graphicImage id'(img( value'(/ui/-arca/campnou.,pg( style'(display:none(/>
With thi ettin,E out&ut6in3 beco"e the tri,,er +or the e++ect on ,ra&hicI"a,e. When the (in3 i
c(ic3edE initia((y hidden ,ra&hicI"a,e co"e u& 'ith a +ade e++ect.
NoteN It i"&ortant +or co"&onent that have the e++ect co"&onent a a chi(d to have an
ai,ned id becaue o"e co"&onent do not render their c(ientId i+ you dont ,ive the" an id
e0&(icit(y.
*ist o% /%%ects
#o((o'in, i the (it o+ e++ectK
G b(ind
G c(i&
G dro&
G e0&(ode
G +o(d
G &u++
G (ide
G ca(e
G bounce
G hi,h(i,ht
G &u(ate
G ha3e
G i=e
G tran+er
193
/%%ect $on%i&uration
Each e++ect ha di++erent &ara"eter +or ani"ation (i3e co(orE duration and "ore. In order to chan,e
the con+i,uration o+ the ani"ationE &rovide thee &ara"eter 'ith the +N&ara" ta,.
<p:effect type'(scale( event'(mouseover(>
<f:param name'(percent( value'(+0(/>
</p:effect>
</h:output!e&t>
It i"&ortant to &rovide trin, o&tion 'ith in,(e Cuote.
<p:effect type'(-lind( event'(clic2(>
<f:param name'(direction( value'(?horiOontal?( />
</p:effect>
</h:output!e&t>
#or the +u(( (it o+ con+i,uration &ara"eter +or each e++ectE &(eae ee the /Cuery docu"entationK
http://docs.,Buery.com/KI/$ffects
/%%ect on *oad
E++ect can a(o be a&&(ied to any AS# co"&onent 'hen &a,e i (oaded +or the +irt ti"e or a+ter an
a/a0 reCuet i co"&(eted by uin, load a the event na"e. #o((o'in, e0a"&(e ani"ate "ea,e
'ith &u(ate e++ect a+ter a/a0 reCuet co"&(ete.
<p:messages id'(messages(>
<p:effect type'(pulsate( event'(load( delay'500>
<f:param name'(mode( value'(?show?( />
</p:effect>
</p:messages>
<p:command=utton value'(8ave( action7istener'(./-ean.action0( update'(messages(/>
194
#.#6 Feed"eader
#eedReader i ued to di&(ay content +ro" a +eed.
In%o
9a, feedeader
*o"&onent *(a org.primefaces.component.feedreader.+eedeader
*o"&onent 9y&e org.primefaces.component.+eedeader
Renderer 9y&e org.primefaces.component.+eedeaderenderer
Renderer *(a org.primefaces.component.feedreader.+eedeaderenderer
Attributes
be rendered.
va(ue nu(( Strin, UR6 o+ the +eed.
var nu(( Strin, Iterator to re+er each ite" in +eed.
i=e Un(i"ited Inte,er <u"ber o+ ite" to di&(ay.
)ettin& started with Feed"eader
#eedReader reCuire a +eed ur( to di&(ay and render it content +or each +eed ite".
<p:feedCeader value'(http://rss.news.yahoo.com/rss/sports( var'(feed(>
<h:output!e&t value'(./feed.title0( style'(font3weight: -old(/>
<h:output!e&t value'(./feed.description.value0( escape'(false(/>
<p:separator />
<f:facet name'(error(>
8omething went wrong.
</f:facet>
</p:feedCeader>
<ote that you need the R78E (ibrary in your c(a&ath to "a3e +eedreader 'or3.
195
#.#7 Fieldset
#ie(det i a ,rou&in, co"&onent a an e0tenion to ht"( +ie(det.
In%o
9a, fieldset
*o"&onent *(a org.primefaces.component.fieldset.+ieldset
*o"&onent 9y&e org.primefaces.component.+ieldset
Renderer 9y&e org.primefaces.component.+ieldsetenderer
Renderer *(a org.primefaces.component.fieldset.+ieldsetenderer
Attributes
be rendered.
(e,end nu(( Strin, 9it(e te0t.
ty(e nu(( Strin, In(ine ty(e o+ the +ie(det.
ty(e*(a nu(( Strin, Sty(e c(a o+ the +ie(det.
to,,(eab(e +a(e 1oo(ean 8a3e content to,,(eab(e 'ith ani"ation.
to,,(eS&eed 500 Inte,er 9o,,(e duration in "i((iecond.
co((a&ed +a(e 1oo(ean De+ine initia( viibi(ity tate o+ content.
196
)ettin& started with Fieldset
#ie(det i ued a a container co"&onent +or it chi(dren.
<p:fieldset legend'(8imple 6ieldset(>
<h:panelIrid column'(A(>
<p:graphicImage value'(/images/godfather/*.,pg( />
<h:output!e&t value'(!he story -egins as Don @ito orleone ...( />
</h:panelIrid>
</p:fieldset>
*e&end
6e,end can be de+ined in t'o 'ayE 'ith (e,end attribute a in e0a"&(e above or uin, (e,end
+acet. Ue +acet 'ay i+ you need to &(ace cuto" ht"( other than i"&(e te0t.
<p:fieldset>
<f:facet name'(legend(>
</f:facet>
//content
</p:fieldset>
When both (e,end attribute and (e,end +acet are &reentE +acet i choen.
1o&&leable $ontent
*(ic3in, on +ie(det (e,end can to,,(e contentE thi i handy to ue &ace e++icient(y in a (ayout. Set
to,,(eab(e to true to enab(e thi +eature.
<p:fieldset legend'(!ogglea-le 6ieldset( togglea-le'(true(>
<h:panelIrid column'(A(>
<p:graphicImage value'(/images/godfather/A.,pg( />
<h:output!e&t value'(6rancis 6ord oppolas legendary ...( />
</h:panelIrid>
</p:fieldset>
A,a- .ehaior /ents
toggle i the de+au(t and on(y a/a0 behavior event &rovided by +ie(det that i &roceed 'hen the
content i to,,(ed. In cae you have a (itener de+inedE it 'i(( be invo3ed by &ain, an intance o+
org.primefaces.event.ToggleEvent.
197
.ere i an e0a"&(e that add a +ace"ea,e and u&date ,ro'( co"&onent 'hen +ie(det i
to,,(ed.
<p:growld id'(messages( />
<p:fieldset legend'(!ogglea-le 6ieldset( togglea-le'(true(
<p:a,a& listener'(./-ean.on!oggle0( update'(messages(>
//content
</p:fieldset>
pu-lic void on!oggle9!oggle$vent event: /
@isi-ility visi-ility ' event.get@isi-ility9:;
6aces5essage msg ' new 6aces5essage9:;
msg.set8ummary9(6ieldset ( > event.getId9: > ( toggled(:;
msg.setDetail9(@isi-ility: ( > visi-ility:;
0
$lient Side API
Wid,etN PrimeFaces.widget.Fieldset
to,,(e?@ B void 9o,,(e +ie(det content.
S+innin&
style and styleClass o&tion a&&(y to the +ie(det. #o((o'in, i the (it o+ tructura( ty(e c(aeK
)tyle #lass Applies
.uiB+ie(det 8ain container
.uiB+ie(detBto,,(eab(e 8ain container 'hen +ie(det i to,,(eab(e
.uiB+ie(det .uiB+ie(detB(e,end 6e,end o+ +ie(det
.uiB+ie(detBto,,(eab(e .uiB+ie(detB(e,end 6e,end o+ +ie(det 'hen +ie(det i to,,(eab(e
.uiB+ie(det .uiB+ie(detBto,,(er 9o,,(e icon on +ie(det
1ips
G A co((a&ed +ie(det 'i(( re"ain co((a&ed a+ter a &otbac3 ince +ie(det 3ee& it to,,(e tate
interna((yE you don
Zt need to "ana,e thi uin, to,,(e6itener and co((a&ed o&tion.
198
#.#8 FileDownload
9he (e,acy 'ay to &reent dyna"ic binary data to the c(ient i to 'rite a erv(et or a +i(ter and
trea" the binary data. #i(eDo'n(oad &reent an eaier 'ay to do the a"e.
In%o
9a, fileDo0nload
Action6itener *(a org.primefaces.component.filedo0nload.+ileDo0nloadAction*istener
Attributes
va(ue nu(( Strea"ed*ontent A trea"ed content intance
conte0tDi&oition attach"ent Strin, S&eci+ie di&(ay "ode.
)ettin& started with FileDownload
A uer co""and action i reCuired to tri,,er the +i(edo'n(oad &roce. #i(eDo'n(oad can be
attached to any co""and co"&onent (i3e a co""and1utton or co""and6in3. 9he va(ue o+ the
#i(eDo'n(oad "ut be an org.primefaces.model.StreamedContent intance. We u,,et uin, the
bui(tBin 'efaultStreamedContent i"&(e"entation. #irt &ara"eter o+ the contructor i the binary
trea"E econd i the "i"e9y&e and the third &ara"eter i the na"e o+ the +i(e.
pu-lic class 6ile=ean /
private 8treamedontent file;
pu-lic 6ileDownloadontroller9: /
Input8tream stream ' this.getlass9:.getCesource<s8tream9(yourfile.pdf(:;
file ' new Default8treamedontent9streamH (application/pdf(H
(downloadedLfile.pdf(:;
0
pu-lic 8treamedontent get6ile9: /
return this.file;
0
0
9hi trea"ed content hou(d be bound to the va(ue o+ the +i(eDo'n(oad.
<h:command=utton value'(Download(>
<p:fileDownload value'(./file=ean.file0( />
</h:command=utton>
Si"i(ar(y a "ore ,ra&hica( &reentation 'ou(d be to ue a co""and(in3 'ith an i"a,e.
199
<h:command7in2 value'(Download(>
<p:fileDownload value'(./file=ean.file0(/>
<h:graphicImage value'(pdficon.gif( />
</h:command7in2>
I+ youd (i3e to ue !ri"e#ace co""and1utton and co""and6in3E diab(e a/a0 o&tion a
+i(eDo'n(oad reCuire a +u(( &a,e re+reh to &reent the +i(e.
<p:command=utton value'(Download( a,a&'(false(>
<p:fileDownload value'(./file=ean.file0( />
</p:command=utton>
<p:command7in2 value'(Download( a,a&'(false(>
<p:fileDownload value'(./file=ean.file0(/>
<h:graphicImage value'(pdficon.gif( />
</p:command7in2>
$ontentDisposition
1y de+au(tE content i di&(ayed a an attachment 'ith a do'n(oad dia(o, bo0E another a(ternative i
the inline "odeE in thi cae bro'er 'i(( try to o&en the +i(e interna((y 'ithout a &ro"&t. <ote that
content di&oition i not &art o+ the htt& tandard a(thou,h it i 'ide(y i"&(e"ented.
Monitor Status
A +i(eDo'n(oad &roce i nonBa/a0E a/a0Statu cannot a&&(y. Sti(( !ri"e#ace &rovide a +eature
to "onitor +i(e do'n(oad via c(ient ide monitor'ownloadstartFunction6 endFunction! "ethod.
E0a"&(e be(o' di&(ay a "oda( dia(o, 'hen do'(oad be,in and hide it on co"&(ete.
function show8tatus9: /
#69?statusDialog?:.show9:;
0

function hide8tatus9: /
#69?statusDialog?:.hide9:;
0
</script>
<h:form>
<p:dialog modal'(true( widget@ar'(statusDialog( header'(8tatus( dragga-le'(false(
closa-le'(false(>
<p:graphicImage value'(/design/a,a&loading-ar.gif( />
</p:dialog>
<p:command=utton value'(Download( a,a&'(false(
onclic2'(#rime6aces.monitorDownload9show8tatusH hide8tatus:(>
<p:fileDownload value'(./fileDownloadontroller.file0(/>
</p:command=utton>
</h:form>
*oo3ie "ut be enab(ed +or "onitorin,.
200
#.': File4pload
#i(eU&(oad ,oe beyond the bro'er in&ut ty&ePI+i(eI +unctiona(ity and +eature an .9865
&o'ered rich o(ution 'ith ,race+u( de,radation +or (e,acy bro'er.
In%o
9a, file-pload
*o"&onent *(a org.primefaces.component.fileupload.+ile-pload
*o"&onent 9y&e org.primefaces.component.+ile-pload
Renderer 9y&e org.primefaces.component.+ile-ploadenderer
Renderer *(a org.primefaces.component.fileupload.+ile-ploadenderer
Attributes
rendered.
201
converter nu(( *onverter
QStrin,
cae it a tatic te0tE it "ut re+er to a converter id.
va(idation +ai(.
u&date nu(( Strin, *o"&onent?@ to u&date a+ter +i(eu&(oad co"&(ete.
&roce nu(( Strin, *o"&onent?@ to &roce in +i(eu&(oad reCuet.
+i(eU&(oad6itener nu(( 8ethodE0&r 8ethod to invo3e 'hen a +i(e i u&(oaded.
"u(ti&(e +a(e 1oo(ean A((o' chooin, o+ "u(ti +i(e u&(oad +ro" native
+i(e bro'e dia(o,
auto +a(e 1oo(ean When et to trueE e(ectin, a +i(e tart the u&(oad
&roce i"&(icit(y.
(abe( *hooe Strin, 6abe( o+ the bro'e button.
a((o'9y&e nu(( Strin, Re,u(ar e0&reion +or acce&ted +i(e ty&eE
e.,. Q?].^]Q@?,i+^/&e$,^&n,@_Q
i=e6i"it nu(( Inte,er Individua( +i(e i=e (i"it in byte.
+i(e6i"it nu(( Inte,er 8a0i"u" nu"ber o+ +i(e a((o'ed to u&(oad.
"ode advanced Strin, 8ode o+ the +i(eu&(oadE can be simple or advanced.
u&(oad6abe( U&(oad Strin, 6abe( o+ the u&(oad button.
cance(6abe( *ance( Strin, 6abe( o+ the cance( button.
202
inva(idSi=e8ea,e nu(( Strin, 8ea,e to di&(ay 'hen i=e (i"it e0ceed.
inva(id#i(e8ea,e nu(( Strin, 8ea,e to di&(ay 'hen +i(e i not acce&ted.
+i(e6i"it8ea,e nu(( Strin, 8ea,e to di&(ay 'hen +i(e (i"it e0ceed.
dra,Dro&Su&&ort true 1oo(ean S&eci+ie dra,dro& baed +i(e e(ection +ro"
+i(eyte"E de+au(t i true and 'or3 on(y on
u&&orted bro'er.
ontart nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen u&(oad be,in.
onerror nu(( Strin, *a((bac3 to e0ecute i+ +i(eu&(oad reCuet +ai(.
onco"&(ete nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen u&(oad end.
diab(ed +a(e 1oo(ean Diab(e co"&onent 'hen et true.
"ea,e9e"&(ate Vna"eW
Vi=eW
Strin, 8ea,e te"&(ate to ue 'hen di&(ayin, +i(e
va(idation error.
&revie'Width 20 Inte,er Width +or i"a,e &revie' in &i0e(.
)ettin& started with File4pload
#i(eU&(oad en,ine on the erver ide can either be erv(et ).0 or co""on +i(eu&(oad. !ri"e#ace
e(ect the "ot a&&ro&riate u&(oader en,ine by detection and it i &oib(e to +orce one or the other
ui,n an optional con+i,uration &ara".
<conte&t3param>
<param3name>primefaces.K#7O<D$C</param3name>
<param3value>auto[native[commons</param3value>
</conte&t3param>
autoN 9hi i the de+au(t "ode and !ri"e#ace trie to detect the bet "ethod by chec3in, the
runti"e environ"entE i+ AS# runti"e i at (eat %.% native u&(oader i e(ectedE other'ie co""on.
native4 <ative "ode ue erv(et ).0 !art A!I to u&(oad the +i(e and i+ AS# runti"e i (e than %.%
and e0ce&tion i bein, thro'n.
commonsN 9hi o&tion chooe co""on +i(eu&(oad re,ard(e o+ the environ"entE advanta,e o+
thi o&tion i that it 'or3 even on a Serv(et %.5 environ"ent.
I+ you have decided to chooe co""on +i(eu&(oadE it reCuire the +o((o'in, +i(ter con+i,ration in
your 'eb de&(oy"ent decri&tior.
203
<filter>
<filter3name>#rime6aces 6ileKpload 6ilter</filter3name>
<filter3class>
org.primefaces.we-app.filter.6ileKpload6ilter
</filter3class>
</filter>
<filter3mapping>
<servlet3name>6aces 8ervlet</servlet3name>
</filter3mapping>
<ote that the erv(etBna"e hou(d "atch the con+i,ured na"e o+ the AS# erv(et 'hich i #ace
Serv(et in thi cae. A(ternative(y you can do a con+i,uration baed on ur(B&attern a 'e((.
Simple File 4pload
Si"&(e +i(e u&(oad "ode 'or3 in (e,acy "ode 'ith a +i(e in&ut 'hoe va(ue hou(d be an
U&(oaded#i(e intance. A/a0 u&(oad are not u&&orted in i"&(e u&(oad.
<h:form enctype'(multipart/form3data(>
<p:fileKpload value'(./file=ean.file0( mode'(simple( />
<p:command=utton value'(8u-mit( a,a&'(false(/>
</h:form>
import org.primefaces.model.Kploaded6ile;
private Kploaded6ile file;
//getter3setter
0
Adanced File 4pload
#i(eU&(oad6itener i the 'ay to acce the u&(oaded +i(e in thi "odeE 'hen a +i(e i u&(oaded
de+ined +i(eU&(oad6itener i &roceed 'ith a #i(eU&(oadEvent a the &ara"eter.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( />
pu-lic void handle6ileKpload96ileKpload$vent event: /
Kploaded6ile file ' event.get6ile9:;
//application code
0
0
204
Multiple 4ploads
8u(ti&(e u&(oad can be enab(ed uin, the "u(ti&(e attribute o that "u(ti&(e +i(e can be e(ected
+ro" bro'er dia(o,. 8u(ti&(e u&(oad are not u&&orted in (e,acy bro'er. <ote that "u(ti&(e
"ode i +or e(ection on(yE it doe not end a(( +i(e in one reCuet. #i(eU&(oad co"&onent a('ay
ue a ne' reCuet +or each +i(e.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( multiple'(true( />
Auto 4pload
De+au(t behavior reCuire uer to tri,,er the u&(oad &roceE you can chan,e thi 'ay by ettin,
auto to true. Auto u&(oad are tri,,ered a oon a +i(e are e(ected +ro" the dia(o,.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( auto'(true( />
Partial Pa&e 4pdate
A+ter the +i(eU&(oad &roce co"&(ete you can ue the !ri"e#ace !!R to u&date any co"&onent
on the &a,e. #i(eU&(oad i eCui&&ed 'ith the u&date attribute +or thi &ur&oe. #o((o'in, e0a"&(e
di&(ay a I#i(e U&(oadedI "ea,e uin, the ,ro'( co"&onent a+ter +i(e u&(oad.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( update'(msg( />
<p:growl id'(msg( />
pu-lic void handle6ileKpload96ileKpload$vent event: /
//add facesmessage to display with growl
//application code
0
0
File Filters
Uer can be retricted to on(y e(ect the +i(e ty&e youve con+i,uredE e0a"&(e be(o' de"ontrate
ho' to acce&t i"a,e on(y.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0(
allow!ypes'(/9\.[\/:9gif[,peMg[png:V/(/>
Si9e *imit
8ot o+ the ti"e you "i,ht need to retrict the +i(e u&(oad i=e +or a +i(eE thi i a i"&(e a ettin,
the i=e6i"it con+i,uration. #o((o'in, +i(eU&(oad (i"it the i=e to 1000 byte +or each +i(e.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( siOe7imit'(*000( />
205
File *imit
#i(e6i"it retrict the nu"ber o+ "a0i"u" +i(e that can be u&(oaded.
<p:fileKpload fileKpload7istener'(./file=ean.handle6ileKpload0( file7imit'()( />
<alidation Messa&es
invalidFile-essageE invalidSi/e-essage and file&imit-essage o&tion are &rovided to di&(ay
va(idation "ea,e to the uer. Si"i(ar to the #ace8ea,e "ea,e A!IE thee "ea,e de+ine
the u""ary &artE the detai( &art i retrieved +ro" the messageTemplate o&tion 'here de+au(t va(ue
i Vna"eW Vi=eW.
S+innin&
#i(eU&(oad reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. A 3innin,
tructura( ty(e c(ae
#lass Applies
.uiB+i(eu&(oad 8ain container e(e"ent
.+i(eu&(oadBbuttonbar 1utton bar.
.+i(ein&utBbutton 1ro'e button.
.uiB+i(eu&(oad tart U&(oad button.
.uiB+i(eu&(oad cance( *ance( button.
+i(eu&(oadBcontent *ontent container.
.rowser $ompatibility
Advanced u&(oader i i"&(e"ented 'ith .9865 and &rovide +ar "ore +eature co"&ared to in,(e
verion. #or (e,acy bro'er that do not u&&ort .8965 +eature (i3e canva or +i(e a&iE +i(eu&(oad
ue ,race+u( de,radation o that i+ra"e i ued +or tran&ortE detai(ed +i(e in+or"ation i not ho'n
and a ,i+ ani"ation i di&(ayed intead o+ &ro,re bar. It i u,,eted to o++er i"&(e u&(oader a a
+a((bac3.
Filter $on%i&uration
#i(ter con+i,uration i reCuired i+ you are uin, co""on u&(oader on(y. 9'o con+i,uration o&tion
e0itE threho(d i=e and te"&orary +i(e u&(oad (ocation.
Parameter Name Description
threho(dSi=e 8a0i"u" +i(e i=e in byte to 3ee& u&(oaded +i(e in "e"ory. I+ a +i(e
e0ceed thi (i"itE it(( be te"&orari(y 'ritten to di3.
u&(oadDirectory Di3 re&oitory &ath to 3ee& te"&orary +i(e that e0ceed the threho(d i=e.
1y de+au(t it i Syte".,et!ro&erty?I/ava.io.t"&dirI@
206
An e0a"&(e con+i,uration be(o' de+ined threho(dSi=e to be 503b and u&(oad to uer te"&orary
+o(der.
<filter>
<filter3class>
org.primefaces.we-app.filter.6ileKpload6ilter
</filter3class>
<init3param>
<param3name>threshold8iOe</param3name>
<param3value>5*A00</param3value>
</init3param>
<init3param>
<param3name>uploadDirectory</param3name>
<param3value>/Ksers/primefaces/temp</param3value>
</init3param>
</filter>
<ote that u&(oadDirectory i ued interna((yE you a('ay need to i"&(e"ent the (o,ic to ave the +i(e
content youre(+ in your bac3in, bean.
207
#.'1 Focus
#ocu i a uti(ity co"&onent that "a3e it eay to "ana,e the e(e"ent +ocu on a AS# &a,e.
In%o
9a, focus
*o"&onent *(a org.primefaces.component.focus.+ocus
*o"&onent 9y&e org.primefaces.component.+ocus.+ocusTag
Renderer 9y&e org.primefaces.component.+ocusenderer
Renderer *(a org.primefaces.component.focus.+ocusenderer
Attributes
be rendered.
+or nu(( Strin, S&eci+ie the e0act co"&onent to et +ocu
conte0t nu(( Strin, 9he root co"&onent to tart +irt in&ut earch.
"inSeverity error Strin, 8ini"u" everity (eve( to be ued 'hen +indin,
the +irt inva(id co"&onent
)ettin& started with Focus
1y de+au(t +ocu 'i(( +ind the first enabled and visible input component on &a,e and a&&(y +ocu.
In&ut co"&onent can be any e(e"ent uch a in&utE te0tarea and e(ect.
<p:focus />
<p:input!e&t ... />
<h:input!e&t ... />
<h:selectOne5enu ... />
#o((o'in, i a i"&(e e0a"&(eK
208
<h:form>
<p:panel id'(panel( header'(Cegister(>
<p:focus />
<p:messages />
<h:panelIrid columns'()(>
<h:output7a-el for'(firstname( value'(6irstname: W( />
<h:input!e&t id'(firstname( value'(./ppr=ean.firstname0(
reBuired'(true( la-el'(6irstname( />
<p:message for'(firstname( />
<h:output7a-el for'(surname( value'(8urname: W( />
<h:input!e&t id'(surname( value'(./ppr=ean.surname0(
reBuired'(true( la-el'(8urname(/>
<p:message for'(surname( />
</h:panelIrid>
<p:command=utton value'(8u-mit( update'(panel(
action7istener'(./ppr=ean.save#erson0( />
</p:panel>
</h:form>
When thi &a,e initia((y o&en u&E in&ut te0t 'ith id I+irtna"eI 'i(( receive +ocu a it i the +irt
in&ut co"&onent.
<alidation Aware
Another ue+u( +eature o+ +ocu i that 'hen va(idation +ai(E first invalid component 'i(( receive a
+ocu. So in &reviou e0a"&(e i+ +irtna"e +ie(d i va(id but urna"e +ie(d ha no in&utE a va(idation
error 'i(( be raied +or urna"eE in thi cae +ocu 'i(( be et on urna"e +ie(d i"&(icit(y. <ote that
+or thi +eature to 'or3 on a/a0 reCuetE you need to u&date &N+ocu co"&onent a 'e((.
/-plicit Focus
Additiona((yE uin, +or attribute +ocu can be et e0&(icit(y on an in&ut co"&onent 'hich i ue+u(
'hen uin, a dia(o,.
<p:focus for'(te&t(/>
<h:input!e&t id'(te&t( value'(/-ean.value0( />
209
#.'2 Fra&ment
#ra,"ent co"&onent i ued to de+ine auto"atica((y &artia((y &roce and u&date ection 'henever
a/a0 reCuet i tri,,ered by a decendant co"&onent.
In%o
9a, fragment
*o"&onent *(a org.primefaces.component.fragment.+ragment
*o"&onent 9y&e org.primefaces.component.+ragment
Renderer 9y&e org.primefaces.component.+ragmentenderer
Renderer *(a org.primefaces.component.fragment.+ragmentenderer
Attributes
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE 'hen
et to +a(e co"&onent 'i(( not be rendered.
bindin, nu(( 7b/ect An e( e0&reion that "a& to a erver ide UI*o"&onent intance
in a bac3in, bean
autoU&date +a(e 1oo(ean U&date the +ra,"ent auto"atica((y.
)ettin& started with Fra&ment
In the +o((o'in, caeE reCuired in&ut +ie(d outide the +ra,"ent i i,nored and on(y the content o+
the +ra,"ent are &roceedBu&dated auto"atica((y on button c(ic3 ince button i inide the
+ra,"ent. #ra,"ent "a3e it eay to de+ine &artia( a/a0 &roce and u&date 'ithout e0&(icit(y
de+inin, co"&onent identi+ier.
210
<h:form>
<h:panelIrid columns'(A(>
<p:output7a-el for'(ign( value'(CeBuired:( />
<p:input!e&t id'(ign( reBuired'(true( />
</h:panelIrid>

<p:fragment autoKpdate'(true(>
<h:panelIrid columns'(E( cellpadding'(5(>
<h:output7a-el for'(name( value'(Jame:( />
<p:input!e&t id'(name( value'(./ppr=ean.firstname0( />
<p:command=utton value'(8u-mit(/>
<h:output!e&t value'(./ppr=ean.firstname0( />
</h:panelIrid>
</p:fragment>
</h:form>
AutoU&date ha di++erent notion co"&ared to autoU&date o+ "ea,eE ,ro'( and out&ut!ane(. 9he
+ra,"ent i u&dated auto"atica((y a+ter an a/a0 reCuet i+ the ource i a decendant. In other
"entioned co"&onentE there i no uch retriction a they are u&dated +or every a/a0 reCuet
re,ard(e o+ the ource.
211
#.'# )alleria
Ga((eria i ued to di&(ay a et o+ i"a,e.
In%o
9a, galleria
*o"&onent *(a org.primefaces.component.galleria./alleria
*o"&onent 9y&e org.primefaces.component./alleria
Renderer 9y&e org.primefaces.component./alleriaenderer
Renderer *(a org.primefaces.component.galleria./alleriaenderer
Attributes
be rendered.
va(ue nu(( *o((ection *o((ection o+ data to di&(ay.
var nu(( Strin, <a"e o+ variab(e to acce an ite" in co((ection.
e++ect +ade Strin, <a"e o+ ani"ation to ue.
212
e++ectS&eed 500 Inte,er Duration o+ ani"ation in "i((iecond.
&ane(Width 400 Inte,er Width o+ the vie'&ort.
&ane(.ei,ht -00 Inte,er .ei,ht o+ the vie'&ort.
+ra"eWidth 40 Inte,er Width o+ the +ra"e.
+ra"e.ei,ht -0 Inte,er .ei,ht o+ the +ra"e.
ho'#i("tri& true 1oo(ean De+ine viibi(ity o+ +i("tri&.
ho'*a&tion +a(e 1oo(ean De+ine viibi(ity o+ ca&tion.
tranitionInterva( -000 Inte,er De+ine interva( o+ (ideho'.
auto!(ay true 1oo(ean I"a,e are di&(ayed in a (ideho' in auto!(ay.
)ettin& Started with )alleria
I"a,e to di&(ayed are de+ined a chi(dren o+ ,a((eriaK
<p:galleria effect'(slide( effectDuration'(*000(>
<p:graphicImage value'(/images/image*.,pg( title'(image*( alt'(image* desc( />
<p:graphicImage value'(/images/imageA.,pg( title'(image*( alt'( imageA desc( />
<p:graphicImage value'(/images/image).,pg( title'(image*( alt'( image) desc( />
<p:graphicImage value'(/images/imageE.,pg( title'(image*( alt'( imageE desc( />
</p:galleria>
Ga((eria di&(ay the detai( o+ an i"a,e uin, an over(ay 'hich i di&(ayed by c(ic3in, the
in+or"ation icon. 9it(e o+ thi &o&u& i retrieved +ro" the i"a,e title attribute and decri&tion +ro"
alt attribute o it i u,,eted to &rovide thee attribute a 'e((.
Dynamic $ollection
8ot o+ the ti"eE you 'ou(d need to di&(ay a dyna"ic et o+ i"a,e rather than de+inin, each
i"a,e dec(arative(y. #or thi you can ue bui(tBin data iteration +eature.
<p:galleria value'(./galleria=ean.images0( var'(image( >
<p:graphicImage value'(./image.path0(
title'(./image.title0( alt'(./image.description0( />
</p:galleria>
/%%ects
9here are variou e++ect o&tion to be ued in tranitionK b(indE bounceE c(i&E dro&E e0&(odeE +adeE
+o(dE hi,h(i,htE &u++E &u(ateE ca(eE ha3eE i=eE (ide and tran+er.
1y de+au(t ani"ation ta3e 500 "i((iecondE ue effectSpeed o&tion to tune thi.
213
<p:galleria effect'(slide( effect8peed'(*000(>
//images
</p:galleria>
S+innin&
Ga((eria reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. A 3innin,
tructura( ty(e c(ae
)tyle #lass Applies
.uiB,a((eria *ontainer e(e"ent +or ,a((eria.
.uiB,a((eriaB&ane(B'ra&&er *ontainer o+ &ane(.
.uiB,a((eriaB&ane( *ontainer o+ each i"a,e.
.uiB,a((eriaBca&tion *a&tion e(e"ent.
.uiB,a((eriaBnavB&revE .uiB,a((eriaBnavBne0t <avi,ator o+ +i("tri&.
.uiB,a((eriaB+i("tri&B'ra&&er *ontainer o+ +i("tri&.
.uiB,a((eriaB+i("tri& #i("tri& e(e"ent.
.uiB,a((eriaB+ra"e #ra"e e(e"ent in a +i("tri&.
.uiB,a((eriaB+ra"eBcontent *ontent o+ a +ra"e.
.uiB,a((eriaB+ra"eBi"a,e 9hu"bnai( i"a,e.
214
#.'' )Map
G8a& i a "a& co"&onent inte,rated 'ith Goo,(e 8a& A!I >).
In%o
9a, gmap
*o"&onent *(a org.primefaces.component.gmap./!ap
*o"&onent 9y&e org.primefaces.component./map
Renderer 9y&e org.primefaces.component./mapenderer
Renderer *(a org.primefaces.component.gmap./mapenderer
Attributes
not be rendered.
"ode( nu(( 8a&8ode( An or,.&ri"e+ace."ode(.8a&8ode( intance.
215
ty(e nu(( Strin, In(ine ty(e o+ the "a& container.
ty(e*(a nu(( Strin, Sty(e c(a o+ the "a& container.
ty&e nu(( Strin, 9y&e o+ the "a&.
center nu(( Strin, *enter &oint o+ the "a&.
=oo" 2 Inte,er De+ine the initia( =oo" (eve(.
treet>ie' +a(e 1oo(ean *ontro( treet vie' u&&ort.
diab(eDe+au(tUI +a(e 1oo(ean Diab(e de+au(t UI contro(
navi,ation*ontro( true 1oo(ean De+ine viibi(ity o+ navi,ation contro(.
"a&9y&e*ontro( true 1oo(ean De+ine viibi(ity o+ "a& ty&e contro(.
dra,,ab(e true 1oo(ean De+ine dra,,abi(ity o+ "a&.
diab(edDoub(e*(ic3Uoo" +a(e 1oo(ean Diab(e =oo"in, on "oue doub(e c(ic3.
on!oint*(ic3 nu(( Strin, Aavacri&t ca((bac3 to e0ecute 'hen a &oint on
"a& i c(ic3ed.
+it1ound true 1oo(ean De+ine i+ center and =oo" hou(d be ca(cu(ated
auto"atica((y to contain a(( "ar3er on the
"a&.
)ettin& started with )Map
#irt thin, to do i &(acin, >) o+ the Goo,(e 8a& A!I that the G8a& i baed on. Idea( (ocation i
the head ection o+ your &a,e.
<script src'(http://maps.google.com/maps/api/,sMsensor'true[false(
type'(te&t/,avascript(></script>
A Goo,(e 8a& a&i tateE "andatory enor &ara"eter i ued to &eci+y i+ your a&&(ication
reCuire a enor (i3e G!S (ocator. #our o&tion are reCuired to &(ace a ,"a& on a &a,eE thee are
centerE =oo"E ty&e and ty(e.
<p:gmap center'(E*.)G*5EAH A.*AAG+)( Ooom'(*5( type'(hy-rid(
style'(width:U00p&;height:E00p&( />
centerN *enter o+ the "a& in (atE (n, +or"at
/oomN Uoo" (eve( o+ the "a&
typeN 9y&e o+ "a&E va(id va(ue areE IhybridIE Iate((iteIE IhybridI and IterrainI.
styleN Di"enion o+ the "a&.
216
MapModel
G8a& i bac3ed by an org.primefaces.model.map.-ap-odel intanceE !ri"e#ace &rovide
org.primefaces.model.map.'efault-ap-odel a the de+au(t i"&(e"entation. A!I Doc o+ a(( G8a&
re(ated "ode( c(ae are avai(ab(e at the end o+ G8a& ection and a(o at /avadoc o+ !ri"e#ace.
Mar+ers
A "ar3er i re&reented by org.primefaces.model.map.-ar"er.
style'(width:U00p&;height:E00p&( model'(./map=ean.model0(/>
pu-lic class 5ap=ean /
private 5ap5odel model ' new Default5ap5odel9:;
pu-lic 5ap=ean9: /
model.addOverlay9new 5ar2er9new 7at7ng9)U.GP+EUUH )0.UUPUEG:H (5*(::;
//more overlays
0
pu-lic 5ap5odel get5odel9: / return this.model; 0
0
Polylines
A &o(y(ine i re&reented by org.primefaces.model.map.Polyline.
217
private 5ap5odel model;
pu-lic 5ap=ean9: /
model ' new Default5ap5odel9:;
#olyline polyline ' new #olyline9:;
polyline.get#aths9:.add9new 7at7ng9)U.GP+EUUH )0.UUPUEG::;
polyline.get#aths9:.add9new 7at7ng9)U.GG)P0PH )0.UG+A*U::;
polyline.get#aths9:.add9new 7at7ng9)U.GP+P0)H )0.P0UP0P::;
polyline.get#aths9:.add9new 7at7ng9)U.GG5A))H )P.P0A)A)::;
model.addOverlay9polyline:;
0
0
Poly&ons
A &o(y,on i re&reented by org.primefaces.model.map.Polygon.
pu-lic 5ap=ean9: /
#olygon polygon ' new #olygon9:;
polyline.get#aths9:.add9new 7at7ng9)U.GP+EUUH )0.UUPUEG::;
polyline.get#aths9:.add9new 7at7ng9)U.GG)P0PH )0.UG+A*U::;
polyline.get#aths9:.add9new 7at7ng9)U.GP+P0)H )0.P0UP0P::;
model.addOverlay9polygon:;
0
0
$ircles
A circ(e i re&reented by org.primefaces.model.map.Circle.
218
pu-lic 5ap=ean9: /
ircle circle ' new ircle9new 7at7ng9)U.GP+EUUH )0.UUPUEG:H 500:;
model.addOverlay9circle:;
0
0
"ectan&les
A circ(e i re&reented by org.primefaces.model.map.+ectangle.
pu-lic 5ap=ean9: /
7at7ng coord* ' new 7at7ng9)U.GP+EUUH )0.UUPUEG:;
7at7ng coordA ' new 7at7ng9)U.GG)P0PH )0.UG+A*U:;
Cectangle rectangle ' new Cectangle9coord*H coordA:;
model.addOverlay9circle:;
0
0
A,a- .ehaior /ents
G8a& &rovide "any cuto" a/a0 behavior event +or you to hoo3Bin to variou +eature.
over(aySe(ect or,.&ri"e+ace.event."a&.7ver(aySe(ectEvent When an over(ay i e(ected.
tate*han,e or,.&ri"e+ace.event."a&.State*han,eEvent When "a& tate chan,e.
&ointSe(ect or,.&ri"e+ace.event."a&.!ointSe(ectEvent When an e"&ty &oint i e(ected.
"ar3erDra, or,.&ri"e+ace.event."a&.8ar3erDra,Event When a "ar3er i dra,,ed.
#o((o'in, e0a"&(e di&(ay a #ace8ea,e about the e(ected "ar3er 'ith ,ro'( co"&onent.
219
<h:form>
<p:growl id'(growl( />
style'(width:U00p&;height:E00p&( model'(./map=ean.model0(>
<p:a,a& event'(overlay8elect( listener'(./map=ean.on5ar2er8elect0(
update'(growl( />
</p:gmap>
</h:form>
pu-lic 5ap=ean9: /
//add mar2ers
0
pu-lic 5ap5odel get5odel9: /
return model
0
pu-lic void on5ar2er8elect9Overlay8elect$vent event: /
5ar2er selected5ar2er ' 95ar2er: event.getOverlay9:;
//add facesmessage
0
0
In%oWindow
A co""on ue cae i di&(ayin, an in+o 'indo' 'hen a "ar3er i e(ected. gmap*nfo5indow i
ued to i"&(e"ent thi &ecia( ue cae. #o((o'in, e0a"&(eE di&(ay an in+o 'indo' that contain
an i"a,e o+ the e(ected "ar3er data.
<h:form>
style'(width:U00p&;height:E00p&( model'(./map=ean.model0(>
<p:a,a& event'(overlay8elect( listener'(./map=ean.on5ar2er8elect0( />
<p:gmapInfo1indow>
<p:graphicImage value'(/images/./map=ean.mar2er.data.image0( />
<h:output!e&t value'(./map=ean.mar2er.data.title0( />
</p:gmapInfo1indow>
</p:gmap>
</h:form>
220
private 5ar2er mar2er;
pu-lic 5ap=ean9: /
//add mar2ers
0
pu-lic 5ap5odel get5odel9: / return model; 0
pu-lic 5ar2er get5ar2er9: / return mar2er; 0
pu-lic void on5ar2er8elect9Overlay8elect$vent event: /
this.mar2er ' 95ar2er: event.getOverlay9:;
0
0
Street <iew
Stree>ie' i enab(ed i"&(y by ettin, street2iew o&tion to true.
style'(width:U00p&;height:E00p&( street@iew'(true( />
221
Map $ontrols
*ontro( on "a& can be cuto"i=ed via attribute (i3e navigationControl and mapTypeControl.
A(ternative(y ettin, disable'efault(* to true 'i(( re"ove a(( contro( at once.
<p:gmap center'(E*.)G*5EAH A.*AAG+)( Ooom'(*5( type'(terrain(
style'(width:U00p&;height:E00p&(
map!ypeontrol'(false( navigationontrol'(false( />
0atie )oo&le Maps API
In cae you need to acce native ,oo,(e "a& a&i 'ith /avacri&tE ue &rovided get-ap! "ethod.
var gmap ' #69?your1idget@ar?:.get5ap9:;
//gmap is a google.maps.5ap instance
#u(( "a& a&i i &rovided atK
htt&NQQcode.,oo,(e.co"Qa&iQ"a&Qdocu"entationQ/avacri&tQre+erence.ht"(
)Map API
org.primefaces.model.map.-ap-odel ?org.primefaces.model.map.'efault-ap-odel i the de+au(t
i"&(e"entation@
!et"od Description
add7ver(ay?7ver(ay over(ay@ Add an over(ay to "a&
6itS8ar3erT ,et8ar3er?@ Return the (it o+ "ar3er
6itS!o(y(ineT ,et!o(y(ine?@ Return the (it o+ &o(y(ine
6itS!o(y,onT ,et!o(y,on?@ Return the (it o+ &o(y,on
6itS*irc(eT ,et*irc(e?@ Return the (it o+ circ(e
6itSRectan,(eT ,etRectan,(e?@ Return the (it o+ rectan,(e.
7ver(ay +ind7ver(ay?Strin, id@ #ind an over(ay by it uniCue id
222
org.primefaces.model.map.,verlay
id nu(( Strin, Id o+ the over(ayE ,enerated and ued interna((y
data nu(( 7b/ect Data re&reented in "ar3er
=inde0 nu(( Inte,er UBInde0 o+ the over(ay
org.primefaces.model.map.-ar"er e0tend org.primefaces.model.map.,verlay
tit(e nu(( Strin, 9e0t to di&(ay on ro((over
(at(n, nu(( 6at6n, 6ocation o+ the "ar3er
icon nu(( Strin, Icon o+ the +ore,round
hado' nu(( Strin, Shado' i"a,e o+ the "ar3er
curor &ointer Strin, *uror to di&(ay on ro((over
dra,,ab(e 0 1oo(ean De+ine i+ "ar3er can be dra,,ed
c(ic3ab(e 1 1oo(ean De+ine i+ "ar3er can be dra,,ed
+(at 0 1oo(ean I+ enab(edE hado' i"a,e i not di&(ayed
viib(e 1 1oo(ean De+ine viibi(ity o+ the "ar3er
org.primefaces.model.map.Polyline e0tend org.primefaces.model.map.,verlay
&ath nu(( 6it 6it o+ coordinate
tro3e*o(or nu(( Strin, *o(or o+ a (ine
tro3e7&acity 1 Doub(e 7&acity o+ a (ine
tro3eWei,ht 1 Inte,er Width o+ a (ine
org.primefaces.model.map.Polygon e0tend org.primefaces.model.map.,verlay
&ath nu(( 6it 6it o+ coordinate
tro3e*o(or nu(( Strin, *o(or o+ a (ine
tro3e7&acity 1 Doub(e 7&acity o+ a (ine
223
tro3eWei,ht 1 Inte,er Wei,ht o+ a (ine
+i((*o(or nu(( Strin, 1ac3,round co(or o+ the &o(y,on
+i((7&acity 1 Doub(e 7&acity o+ the &o(y,on
org.primefaces.model.map.Circle e0tend org.primefaces.model.map.,verlay
center nu(( 6at6n, *enter o+ the circ(e
radiu nu(( Doub(e Radiu o+ the circ(e.
tro3e*o(or nu(( Strin, Stro3e co(or o+ the circ(e.
tro3e7&acity 1 Doub(e Stro3e o&acity o+ circ(e.
tro3eWei,ht 1 Inte,er Stro3e 'ei,ht o+ the circ(e.
+i((*o(or nu(( Strin, 1ac3,round co(or o+ the circ(e.
+i((7&acity 1 Doub(e 7&acity o+ the circ(e.
org.primefaces.model.map.+ectangle e0tend org.primefaces.model.map.,verlay
bound nu(( 6at6n,1ound 1oundarie o+ the rectan,(e.
tro3e*o(or nu(( Strin, Stro3e co(or o+ the rectan,(e.
tro3e7&acity 1 Doub(e Stro3e o&acity o+ rectan,(e.
tro3eWei,ht 1 Inte,er Stro3e 'ei,ht o+ the rectan,(e.
+i((*o(or nu(( Strin, 1ac3,round co(or o+ the rectan,(e.
+i((7&acity 1 Doub(e 7&acity o+ the rectan,(e.
org.primefaces.model.map.&at&ng
(at nu(( doub(e 6atitude o+ the coordinate
(n, nu(( doub(e 6on,itude o+ the coordinate
org.primefaces.model.map.&at&ng)ounds
224
center nu(( 6at6n, *enter coordinate o+ the boundary
northEat nu(( 6at6n, <orthEat coordinate o+ the boundary
outhWet nu(( 6at6n, SouthWet coordinate o+ the boundary
)Map /ent API
A(( c(ae in event a&i e0tend +ro" #ava$.faces.event.FacesEvent.
org.primefaces.event.map.-ar"er'ragEvent
"ar3er nu(( 8ar3er Dra,,ed "ar3er intance
org.primefaces.event.map.,verlaySelectEvent
over(ay nu(( 7ver(ay Se(ected over(ay intance
org.primefaces.event.map.PointSelectEvent
(at6n, nu(( 6at6n, *oordinate o+ the e(ected &oint
org.primefaces.event.map.StateChangeEvent
bound nu(( 6at6n,1ound 1oundarie o+ the "a&
=oo"6eve( 0 Inte,er Uoo" (eve( o+ the "a&
225
#.'3 )MapIn%oWindow
G8a&In+oWindo' i ued 'ith G8a& co"&onent to o&en a 'indo' on "a& 'hen an over(ay i
e(ected.
In%o
9a, gmap.nfo1indo0
9a, *(a org.primefaces.component.gmap./!ap.nfo1indo0Tag
*o"&onent *(a org.primefaces.component.gmap./!ap.nfo1indo0
*o"&onent 9y&e org.primefaces.component./!ap.nfo1indo0
Attributes
be rendered.
"a0Width nu(( Inte,er 8a0i"u" 'idth o+ the in+o 'indo'
)ettin& started with )MapIn%oWindow
See G8a& ection +or "ore in+or"ation about ho' ,"a&In+oWindo' i ued.
226
#.'5 )raphicIma&e
Gra&hicI"a,e e0tend tandard AS# ,ra&hic i"a,e co"&onent 'ith the abi(ity o+ di&(ayin, binary
data (i3e an in&uttrea". 8ain ue cae o+ Gra&hicI"a,e i to "a3e di&(ayin, i"a,e tored in
databae or onBtheB+(y i"a,e eaier. 6e,acy 'ay to do thi i to co"e u& 'ith a Serv(et that doe
the trea"in,E Gra&hicI"a,e doe a(( the hard 'or3 'ithout the need o+ a Serv(et.
In%o
9a, grap"ic.mage
*o"&onent *(a org.primefaces.component.grap"icimage./rap"ic.mage
*o"&onent 9y&e org.primefaces.component./rap"ic.mage
Renderer 9y&e org.primefaces.component./rap"ic.mageenderer
Renderer *(a org.primefaces.component.grap"icimage./rap"ic.mageenderer
Attributes
be rendered.
va(ue nu(( 7b/ect 1inary data to trea" or conte0t re(ative &ath.
a(t nu(( Strin, A(ternate te0t +or the i"a,e
ur( nu(( Strin, A(ia to va(ue attribute
'idth nu(( Strin, Width o+ the i"a,e
hei,ht nu(( Strin, .ei,ht o+ the i"a,e
tit(e nu(( Strin, 9it(e o+ the i"a,e
dir nu(( Strin, Direction o+ the te0t di&(ayed
(an, nu(( Strin, 6an,ua,e code
i"a& +a(e 1oo(ean S&eci+ie to ue a erverBide i"a,e "a&
ue"a& nu(( Strin, <a"e o+ the c(ient ide "a&
ty(e nu(( Strin, Sty(e o+ the i"a,e
227
ty(e*(a nu(( Strin, Sty(e c(a o+ the i"a,e
onc(ic3 nu(( Strin, onc(ic3 do" event hand(er
ondb(c(ic3 nu(( Strin, ondb(c(ic3 do" event hand(er
on3eydo'n nu(( Strin, on3eydo'n do" event hand(er
on3ey&re nu(( Strin, on3ey&re do" event hand(er
on3eyu& nu(( Strin, on3eyu& do" event hand(er
on"ouedo'n nu(( Strin, on"ouedo'n do" event hand(er
on"oue"ove nu(( Strin, on"oue"ove do" event hand(er
on"oueout nu(( Strin, on"oueout do" event hand(er
on"oueover nu(( Strin, on"oueover do" event hand(er
on"oueu& nu(( Strin, on"oueu& do" event hand(er
cache true Strin, Enab(eQDiab(e bro'er +ro" cachin, the i"a,e
na"e nu(( Strin, <a"e o+ the i"a,e.
(ibrary nu(( Strin, 6ibrary na"e o+ the i"a,e.
)ettin& started with )raphicIma&e
Gra&hicI"a,e reCuire an org.primefaces.model.StreamedContent content a it va(ue +or dyna"ic
i"a,e. Strea"ed*ontent i an inter+ace and !ri"e#ace &rovide a bui(tBin i"&(e"entation ca((ed
'efaultStreamedContent. #o((o'in, e0a"&(e (oad an i"a,e +ro" the c(a&ath.
<p:graphicImage value'(./image=ean.image0( />
pu-lic class Image=ean /
private 8treamedontent image;
pu-lic DynamicImageontroller9: /
Input8tream stream ' this.getlass9:.getCesource<s8tream9(-arcalogo.,pg(:;
image ' new Default8treamedontent9streamH (image/,peg(:;
0
pu-lic 8treamedontent getImage9: /
return this.image;
0
0
De+au(tStrea"ed*ontent ,et an in&uttrea" a the +irt &ara"eter and "i"e ty&e a the econd.
In a rea( (i+e a&&(icationE you can create the in&uttrea" a+ter readin, the i"a,e +ro" the databae.
#or e0a"&(e #ava.sql.+esultsSet A!I ha the ,et1inaryStrea"?@ "ethod to read b(ob +i(e tored in
databae.
228
Displayin& $harts with !Free$hart
See tatic i"a,e ection at chart co"&onent +or a a"&(e ua,e o+ ,ra&hicI"a,e 'ith /#ree*hart.
Displayin& a .arcode
Si"i(ar to the chart e0a"&(eE a barcode can be ,enerated a 'e((. 9hi a"&(e ue barbecue &ro/ect
+or the barcode A!I.
<p:graphicImage value'(./-ac2ing=ean.-arcode0( />
pu-lic class =arcode=ean /
private 8treamedontent -arcode;
pu-lic =ac2ing=ean9: /
try /
6ile -arcode6ile ' new 6ile9(dynamic-arcode(:;
=arcodeImage4andler.saveY#$I9
=arcode6actory.createode*AG9(#CI5$6<$8(:H -arcode6ile:;
-arcode ' new Default8treamedontent9
new 6ileInput8tream9-arcode6ile:H (image/,peg(:;
0 catch 9$&ception e: /
e.print8tac2!race9:;
0
0
pu-lic =arcode=ean get=arcode9: /
return this.-arcode;
0
0
Displayin& "e&ular Ima&es
A Gra&hicI"a,e e0tend tandard ,ra&hicI"a,e co"&onentE it can a(o di&(ay re,u(ar non
dyna"ic i"a,e /ut (i3e tandard ,ra&hicI"a,e co"&onent uin, na"e and o&tiona( (ibrary.
<p:graphicImage name'(-arcalogo.,pg( li-rary'(yourapp( />
(ow It Wor+s
Dyna"ic i"a,e di&(ay 'or3 a +o((o'K
G Dyna"ic i"a,e encry& it va(ue e0&reion trin, to ,enerate a 3ey.
G 9hi 3ey i a&&ended to the i"a,e ur( that &oint to AS# reource hand(er.
G *uto" !ri"e#ace Reource.and(er ,et the 3ey +ro" the ur(E decry&t the e0&reion trin, to
o"ethin, (i3e XVbean.trea"ed*ontent>a(ueWE eva(uate it to ,et the intance o+
Strea"ed*ontent +ro" bean and trea" content to c(ient.
229
A a reu(t there 'i(( be % reCuet to di&(ay an i"a,eE +irt bro'er 'i(( "a3e a reCuet to (oad the
&a,e and then another one to the dyna"ic i"a,e ur( that &oint to AS# reource hand(er. !(eae note
that you cannot ue vie'co&e bean a they are not avai(ab(e in reource (oadin, reCuet.
Passin& Parameters and Data Iteration
Mou can &a reCuet &ara"eter to the ,ra&hicI"a,e via +N&ara" ta,E a a reu(t the actua( reCuet
renderin, the i"a,e can have acce to thee va(ue. 9hi i e0tre"e(y handy to di&(ay dyna"ic
i"a,e i+ your i"a,e i in a data iteration co"&onent (i3e datatab(e or uiNre&eat.
230
#.'6 )rowl
Gro'( i baed on the 8ac ,ro'( noti+ication 'id,et and ued to di&(ay #ace8ea,e in an
over(ay.
In%o
9a, gro0l
*o"&onent *(a org.primefaces.component.gro0l./ro0l
*o"&onent 9y&e org.primefaces.component./ro0l
Renderer 9y&e org.primefaces.component./ro0lenderer
Renderer *(a org.primefaces.component.gro0l./ro0lenderer
Attributes
rendered.
tic3y +a(e 1oo(ean S&eci+ie i+ the "ea,e hou(d tay intead o+ hidden
auto"atica((y.
ho'Su""ary true 1oo(ean S&eci+ie i+ the u""ary o+ "ea,e hou(d be
di&(ayed.
ho'Detai( +a(e 1oo(ean S&eci+ie i+ the detai( o+ "ea,e hou(d be di&(ayed.
,(oba(7n(y +a(e 1oo(ean When trueE on(y +ace"ea,e 'ithout c(ientid are
di&(ayed.
(i+e 4000 Inte,er Duration in "i((iecond to di&(ay nonBtic3y
"ea,e.
231
autoU&date +a(e 1oo(ean S&eci+ie auto u&date "ode.
redi&(ay true 1oo(ean De+ine i+ a(ready rendered "ea,ed hou(d be
di&(ayed.
+or nu(( Strin, <a"e o+ aociated 3eyE ta3e &recedence 'hen ued
'ith ,(oba(7n(y.
eca&e true 1oo(ean De+ine 'hether ht"( 'ou(d be eca&ed or not.
everity nu(( Strin, *o""a e&arated (it o+ everitie to di&(ay on(y.
)ettin& Started with )rowl
Gro'( ua,e i i"i(ar to tandard hN"ea,e co"&onent. Si"&(y &(ace ,ro'( any'here on your
&a,eE ince "ea,e are di&(ayed a an over(ayE the (ocation o+ ,ro'( in AS# &a,e doe not "atter.
<p:growl />
*i%etime o% messa&es
1y de+au(t each "ea,e 'i(( be di&(ayed +or 4000 " and then hidden. A "ea,e can be "ade
tic3y "eanin, it(( never be hidden auto"atica((y.
<p:growl stic2y'(true( />
I+ ,ro'( i not 'or3in, in tic3y "odeE it a(o &oib(e to tune the duration o+ di&(ayin,
"ea,e. #o((o'in, ,ro'( 'i(( di&(ay the "ea,e +or 5 econd and then +adeBout.
<p:growl life'(5000( />
)rowl with A,a- 4pdates
I+ you need to di&(ay "ea,e 'ith ,ro'( a+ter an a/a0 reCuet you /ut need to u&date it. <ote
that i+ you enab(e autoU&dateE ,ro'( 'i(( be u&dated auto"atica((y 'ith each a/a0 reCuet any'ay.
<p:growl id'(messages(/>
<p:command=utton value'(8u-mit( update'(messages( />
Positionin&
Gro'( i &oitioned at to& ri,ht corner by de+au(tE &oition can be contro((ed 'ith a *SS e(ector
ca((ed ui1growl. With the be(o' ettin, ,ro'( 'i(( be (ocated at to& (e+t corner.
.ui3growl /
left:A0p&;
0
232
1ar&etable Messa&es
9here "ay be ti"e 'here you need to tar,et one or "ore "ea,e to a &eci+ic "ea,e
co"&onentE +or e0a"&(e u&&oe you have ,ro'( and "ea,e on a"e &a,e and you need to
di&(ay o"e "ea,e on ,ro'( and o"e on "ea,e. Ue +or attribute to aociate "ea,e
'ith &eci+ic co"&onent.
<p:messages for'(some2ey( />
<p:growl for'(another2ey( />
6acesonte&t conte&t ' 6acesonte&t.geturrentInstance9:;
conte&t.add5essage9(some2ey(H faces5essage*:;
conte&t.add5essage9(some2ey(H faces5essageA:;
conte&t.add5essage9(another2ey(H faces5essage):;
In a"&(e aboveE "ea,e 'i(( di&(ay +irt and econd "ea,e and ,ro'( 'i(( on(y di&(ay the
)rd "ea,e.
Seerity *eels
Uin, everity attributeE you can de+ine 'hich everitie can be di&(ayed by the co"&onent. #or
intanceE you can con+i,ure ,ro'( to on(y di&(ay in+o and 'arnin,.
<p:growl severity'(infoHwarn( />
/scapin&
Gro'( eca&e ht"( content in "ea,eE in cae you need to di&(ay ht"( via ,ro'( et eca&e
o&tion to +a(e.
<p:growl escape'(false( />
S+innin&
)tyle #lass Applies
.uiB,ro'( 8ain container e(e"ent o+ ,ro'(
.uiB,ro'(Bite"Bcontainer *ontainer o+ "ea,e
.uiB,ro'(Bite" *ontainer o+ a "ea,e
.uiB,ro'(B"ea,e 9e0t "ea,e container
.uiB,ro'(Btit(e Su""ary o+ the "ea,e
.uiB,ro'(B"ea,e & Detai( o+ the "ea,e
.uiB,ro'(Bi"a,e Severity icon
233
)tyle #lass Applies
.uiB,ro'(Bi"a,eBin+o In+o everity icon
.uiB,ro'(Bi"a,eB'arn Warnin, everity icon
.uiB,ro'(Bi"a,eBerror Error everity icon
.uiB,ro'(Bi"a,eB+ata( #ata( everity icon
234
#.'7 (ot@ey
.ot;ey i a ,eneric 3ey bindin, co"&onent that can bind any +or"ation o+ 3ey to /avacri&t event
hand(er or a/a0 ca((.
In%o
9a, "ot,ey
*o"&onent *(a org.primefaces.component."ot,ey.(ot5ey
*o"&onent 9y&e org.primefaces.component.(ot5ey
Renderer 9y&e org.primefaces.component.(ot5eyenderer
Renderer *(a org.primefaces.component."ot,ey.(ot5eyenderer
Attributes
be rendered.
bind nu(( Strin, 9he ;ey bindin,.
hand(er nu(( Strin, Aavacri&t event hand(er to be e0ecuted 'hen the
3ey bindin, i &reed.
action nu(( 8ethodE0&r A "ethod e0&reion thatd be &roceed in the
&artia( reCuet caued by uia/a0.
action6itener nu(( 8ethodE0&r An action(itener thatd be &roceed in the &artia(
reCuet caued by uia/a0.
i""ediate +a(e 1oo(ean 1oo(ean va(ue that deter"ine the &haeIdE 'hen
true action are &roceed at a&&(yLreCuetLva(ueE
'hen +a(e at invo3eLa&&(ication &hae.
&roce nu(( Strin, *o"&onent id?@ to &roce &artia((y intead o+
'ho(e vie'.
u&date nu(( Strin, *(ient ide id o+ the co"&onent?@ to be u&dated
a+ter aync &artia( ub"it reCuet.
235
ontart nu(( Strin, Aavacri&t hand(er to e0ecute be+ore a/a0 reCuet i
be,in.
onco"&(ete nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet i
co"&(eted.
onucce nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet
ucceed.
onerror nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet
+ai(.
,(oba( true 1oo(ean G(oba( a/a0 reCuet are (itened by a/a0Statu
co"&onentE ettin, ,(oba( to +a(e 'i(( not tri,,er
a/a0Statu.
de(ay nu(( Strin, I+ (e than delay "i((iecond e(a&e bet'een
ca(( to request! on(y the "ot recent one i ent
and a(( other reCuet are dicarded. I+ thi o&tion
i not &eci+iedE or i+ the va(ue o+ delay i the (itera(
trin, OnoneO 'ithout the CuoteE no de(ay i ued.
&artia(Sub"it +a(e 1oo(ean Enab(e eria(i=ation o+ va(ue be(on,in, to the
&artia((y &roceed co"&onent on(y.
reet>a(ue +a(e 1oo(ean I+ trueE (oca( va(ue o+ in&ut co"&onent to be
u&dated 'ithin the a/a0 reCuet 'ou(d be reet.
i,noreAutoU&date +a(e 1oo(ean I+ trueE co"&onent 'hich autoU&datePItrueI 'i((
not be u&dated +or thi reCuet. I+ not &eci+iedE or
the va(ue i +a(eE no uch indication i "ade.
)ettin& Started with (ot@ey
.ot;ey i ued in t'o 'ayE either on c(ient ide 'ith the event hand(er or 'ith a/a0 u&&ort.
Si"&(et e0a"&(e 'ou(d beK
<p:hot2ey -ind'(a( handler'(alert9!#ressed a:;( />
When thi hot3ey i on &a,eE &rein, the a 3ey 'i(( a(ert the !!reed 3ey a te0t.
@ey combinations
8ot o+ the ti"e youd need 3ey co"bination rather than a in,(e 3ey.
<p:hot2ey -ind'(ctrl>s( handler'(alert9!#ressed ctrl>s:;( />
<p:hot2ey -ind'(ctrl>shift>s( handler'(alert9!#ressed ctrl>shift>s:( />
Inte&ration
.ere an e0a"&(e de"ontratin, ho' to inte,rate hot3ey 'ith a c(ient ide a&i. Uin, (e+t and
ri,ht 3ey 'i(( 'itch the i"a,e di&(ayed via the &Ni"a,eS'itch co"&onent.
236
<p:hot2ey -ind'(left( handler'(#69?switcher?:.previous9:;( />
<p:hot2ey -ind'(right( handler'(#69?switcher?:.ne&t9:;( />
<p:image8witch widget@ar'(switcher(>
//content
</p:image8witch>
A,a- Support
A/a0 i a bui(tBin +eature o+ hot;ey "eanin, you can do a/a0 ca(( 'ith 3ey co"bination.
#o((o'in, +or" can be ub"itted 'ith the ctrl<shift<s co"bination.
<h:form>
<p:hot2ey -ind'(ctrl>shift>s( update'(display( />
<h:input!e&t id'(name( value'(./-ean.name0( />
</h:panelIrid>
<h:output!e&t id'(display( value'(4ello: ./-ean.firstname0( />
</h:form>
<ote that hot3ey 'i(( not be tri,,ered i+ there i a +ocued in&ut on &a,e.
237
#.'8 IdleMonitor
Id(e8onitor 'atche uer action on a &a,e and noti+y ca((bac3 in cae they ,o id(e or active a,ain.
In%o
9a, idle!onitor
*o"&onent *(a org.primefaces.component.idlemonitor..dle!onitor
*o"&onent 9y&e org.primefaces.component..dle!onitor
Renderer 9y&e org.primefaces.component..dle!onitorenderer
Renderer *(a org.primefaces.component.idlemonitor..dle!onitor
Attributes
rendered.
ti"eout )00000 Inte,er 9i"e to 'ait in "i((iecond unti( decidin, i+ the uer
i id(e. De+au(t i 5 "inute.
onid(e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen uer ,oe id(e.
onactive nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen uer ,oe id(e.
)ettin& Started with IdleMonitor
9o be,in 'ithE you can hoo3Bin to c(ient ide event that are ca((ed 'hen a uer ,oe id(e or
beco"e active a,ain. E0a"&(e be(o' to,,(e viibi(ity o+ a dia(o, to re&ond thee event.
<p:idle5onitor onidle'(#69?idleDialog?:.show9:;(
onactive'(#69?idleDialog?:.hide9:;(/>
<p:dialog header'(1hat?s happeningM( widget@ar'(idleDialog( modal'(true(>
<h:output!e&t value'(DudeH are you thereM( />
</p:dialog>
238
$ontrollin& 1imeout
1y de+au(tE id(e8onitor 'ait +or 5 "inute ?)00000 "@ unti( tri,,erin, the onid(e event. Mou can
cuto"i=e thi duration 'ith the ti"eout attribute.
A,a- .ehaior /ents
Id(e8onitor &rovide t'o a/a0 behavior event 'hich are idle and active that are +ired accordin, to
uer tatu chan,e. E0a"&(e be(o' di&(ay "ea,e +or each eventK
<p:idle5onitor timeout'(5000( update'(messages(>
<p:a,a& event'(idle( listener'(./-ean.idle7istener0( update'(msg( />
<p:a,a& event'(active( listener'(./-ean.active7istener0( update'(msg( />
</p:idle5onitor>
<p:growl id'msg />
pu-lic class =ean /
pu-lic void idle7istener9: /
//<dd facesmessage
0
pu-lic void idle9: /
//<dd facesmessage
0
0
239
#.3: Ima&e$ompare
I"a,e*o"&are &rovide a uer inter+ace to co"&are t'o i"a,e.
In%o
9a, image#ompare
*o"&onent *(a org.primefaces.component.imagecompare..mage#ompare
*o"&onent 9y&e org.primefaces.component..mage#ompare
Renderer 9y&e org.primefaces.component..mage#ompareenderer
Renderer *(a org.primefaces.component.imagecompare..mage#ompareenderer
Attributes
be rendered.
240
(e+tI"a,e nu(( Strin, Source o+ the i"a,e &(aced on the (e+t ide
ri,htI"a,e nu(( Strin, Source o+ the i"a,e &(aced on the ri,ht ide
'idth nu(( Strin, Width o+ the i"a,e
hei,ht nu(( Strin, .ei,ht o+ the i"a,e
ty(e nu(( Strin, In(ine ty(e o+ the container e(e"ent
ty(e*(a nu(( Strin, Sty(e c(a o+ the container e(e"ent
)ettin& started with Ima&e$ompare
I"a,e*o"&are i created 'ith t'o i"a,e 'ith a"e hei,ht and 'idth. It i reCuired to et 'idth
and hei,ht o+ the i"a,e a 'e((.
<p:imageompare leftImage'(&-o&.png( rightImage'(ps).png(
width'(E)G( height'(AEU(/>
S+innin&
1oth i"a,e are &(aced inide a div container e(e"entE style and styleClass attribute a&&(y to thi
e(e"ent.
241
#.31 Ima&e$ropper
I"a,e*ro&&er a((o' cro&&in, a certain re,ion o+ an i"a,e. A ne' i"a,e i created containin, the
cro&&ed area and ai,ned to a *ro&&edI"a,e intanced on the erver ide.
In%o
9a, image#ropper
*o"&onent *(a org.primefaces.component. imagecropper..mage#ropper
*o"&onent 9y&e org.primefaces.component..mage#ropper
Renderer 9y&e org.primefaces.component..mage#ropperenderer
Renderer *(a org.primefaces.component.imagecropper..mage#ropperenderer
Attributes
rendered.
e0&reion o+ a (itera( te0t
QStrin,
242
E0&r
A "ethod bindin, e0&reion that re+er to a "ethod
E0&r
+or hand(in, a va(uchan,eevent
va(idation +ai(.
i"a,e nu(( Strin, *onte0t re(ative &ath to the i"a,e.
a(t nu(( Strin, A(ternate te0t o+ the i"a,e.
a&ectRatio nu(( Doub(e A&ect ratio o+ the cro&&er area.
"inSi=e nu(( Strin, 8ini"u" i=e o+ the cro&&er area.
"a0Si=e nu(( Strin, 8a0i"u" i=e o+ the cro&&er area.
bac3,round*o(or nu(( Strin, 1ac3,round co(or o+ the container.
bac3,round7&acity 0E4 Doub(e 1ac3,round o&acity o+ the container
initia(*oord nu(( Strin, Initia( coordinate o+ the cro&&er area.
)ettin& started with the Ima&e$ropper
I"a,e*ro&&er i an in&ut co"&onent and i"a,e to be cro&&ed i &rovided via the image attribute.
9he cro&&ed area o+ the ori,ina( i"a,e i ued to create a ne' i"a,eE thi ne' i"a,e can be
acceed on the bac3in, bean by ettin, the va(ue attribute o+ the i"a,e cro&&er. Au"in, the
i"a,e i at RWE1A!!LR779RQca"&nou./&,
<p:imageropper value'(./cropper.croppedImage0( image'(/campnou.,pg( />
pu-lic class ropper /
private roppedImage croppedImage;
//getter and setter
0
org.primefaces.model.Cropped*mage be(on, a !ri"e#ace A!I and contain handy in+or"ation
about the cro& &roce. #o((o'in, tab(e decribe *ro&&edI"a,e &ro&ertie.
Property Type Description
ori,ina(#i(e<a"e Strin, <a"e o+ the ori,ina( +i(e that cro&&ed
byte byteà *ontent o+ the cro&&ed area a a byte array
243
(e+t int 6e+t coordinate
ri,ht int Ri,ht coordinate
'idth int Width o+ the cro&&ed i"a,e
hei,ht int .ei,ht o+ the cro&&ed i"a,e
/-ternal Ima&es
I"a,e*ro&&er ha the abi(ity to cro& e0terna( i"a,e a 'e((.
<p:imageropper value'(./cropper.croppedImage0(
image'( http://primefaces.prime.com.tr/en/images/schema.png(>
</p:imageropper>
$onte-t "elatie Path
#or (oca( i"a,eE I"a,e*ro&&er a('ay reCuire the i"a,e &ath to be conte0t re(ative. So to
acco"&(ih thi i"&(y /ut add (ah ?IQ&athQtoQi"a,e.&n,I@ and i"a,ecro&&er 'i(( reco,ni=e it at
RWE1A!!LR779RQ&athQtoQi"a,e.&n,. Action ur( re(ative (oca( i"a,e are not u&&orted.
Initial $oordinates
1y de+au(tE uer action i neceary to initiate the cro&&er area on an i"a,eE you can &eci+y an
initia( area to di&(ay on &a,e (oad uin, initialCoords o&tion in $6y6w6h +or"at.
<p:imageropper value'(./cropper.croppedImage0( image'(/campnou.,pg(
initialoords'(AA5HP5H)00H*A5(/>
.oundaries
"inSi=e and "a0Si=e attribute are contro( to (i"it the i=e o+ the area to cro&.
<p:imageropper value'(./cropper.croppedImage0( image'(/campnou.,pg(
min8iOe'(50H*00( ma&8iOe'(*50HA00(/>
Sain& Ima&es
1e(o' i an e0a"&(e to ave the cro&&ed i"a,e to +i(e yte".
<p:imageropper value'(./cropper.croppedImage0( image'(/campnou.,pg( />
<p:command=utton value'(rop( action7istener'(./my=ean.crop0( />
244
pu-lic class ropper /
private roppedImage croppedImage;
//getter and setter
pu-lic 8tring crop9: /
8tring new6ileJame ' servletonte&t.getCeal#ath9((: > 6ile.separator >
(ui( > 6ile.separator > (-arca( > 6ile.separator> croppedImage.getOriginal6ileJame9:
> (cropped.,pg(;
6ileImageOutput8tream imageOutput;
try /
imageOutput ' new 6ileImageOutput8tream9new 6ile9new6ileJame::;
imageOutput.write9croppedImage.get=ytes9:H 0H
croppedImage.get=ytes9:.length:;
imageOutput.close9:;
0 catch 9$&ception e: /
e.print8tac2!race9:;
0
return null;
0
0
245
#.32 Ima&eSwitch
I"a,e'itch co"&onent i a i"&(e i"a,e ,a((ery co"&onent.
In%o
9a, image)0itc"
*o"&onent *(a org.primefaces.component.images0itc"..mage)0itc"
*o"&onent 9y&e org.primefaces.component..mage)0itc"
Renderer 9y&e org.primefaces.component..mage)0itc"enderer
Renderer *(a org.primefaces.component.images0itc"..mage)0itc"enderer
Attributes
rendered.
e++ect nu(( Strin, <a"e o+ the e++ect +or tranition.
&eed 500 Inte,er S&eed o+ the e++ect in "i((iecond.
(ideho'S&eed )000 Inte,er S(ideho' &eed in "i((iecond.
(ideho'Auto true 1oo(ean Start (ideho' auto"atica((y on &a,e (oad.
ty(e nu(( Strin, Sty(e o+ the "ain container.
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container.
246
)ettin& Started with Ima&eSwitch
I"a,eS'itch co"&onent need a et o+ i"a,e to di&(ay. !rovide the i"a,e co((ection a a et o+
chi(dren co"&onent.
<p:image8witch effect'(6lyIn(>
<p:graphicImage value'(/images/natureA.,pg( />
<p:graphicImage value'(/images/nature).,pg( />
<p:graphicImage value'(/images/natureE.,pg( />
</p:image8witch>
8ot o+ the ti"eE i"a,e cou(d be dyna"icE uiNre&eat i u&&orted to i"&(e"ent thi cae.
<p:image8witch>
<ui:repeat value'(./-ean.images0( var'(image(>
<p:graphicImage value'(./image0( />
</ui:repeat>
</p:image8witch>
Slideshow or Manual
I"a,eS'itch i in (ideSho' "ode by de+au(tE i+ youd (i3e "anua( tranition diab(e (ideho'
and ue c(ient ide a&i to create contro(.
<p:image8witch effect'(6lyIn( widget@ar'(imageswitch(>
//images
</p:image8witch>
<span onclic2'(#69?imageswitch?:.previous9:;(>#revious</span>
<span onclic2'(#69?imageswitch?:.ne&t9:;(>Je&t</span>
$lient Side API
Wid,etN PrimeFaces.widget.*mageSwitch
tartS(ideho'?@ B void Start (ideho' "ode.
to&S(ideho'?@ B void Sto& (ideho' "ode.
to,,(eS(ideho'?@ B void 9o,,(e (ideho' "ode.
&aueS(ideho'?@ B void !aue (ideho' "ode.
ne0t?@ B void S'itche to ne0t i"a,e.
&reviou?@ B void S'itche to &reviou i"a,e.
'itch9o?inde0@ inde0 void Di&(ay i"a,e 'ith ,iven inde0.
247
/%%ect Speed
9he &eed i conidered in ter" o+ "i((iecond and &eci+ied via the &eed attribute.
<p:image8witch effect'(6lipOut( speed'(*50(>
//set of images
</p:image8witch>
*ist o% /%%ects
I"a,eS'itch u&&ort a 'ide ran,e o+ tranition e++ect. #o((o'in, i the +u(( (itE note that va(ue
are cae enitive.
G b(indF
G b(indM
G b(indU
G cover
G curtainF
G curtainM
G +ade
G +adeUoo"
G ,ro'F
G ,ro'M
G none
G cro((U&
G cro((Do'n
G cro((6e+t
G cro((Ri,ht
G cro((>ert
G hu++(e
G (ideF
G (ideM
G to
G turnU&
G turnDo'n
G turn6e+t
G turnRi,ht
G uncover
G 'i&e
G =oo"
248
#.3# Inplace
In&(ace &rovide eay in&(ace editin, and in(ine content di&(ay. In&(ace conit o+ t'o "e"berE
di&(ay e(e"ent i the initia( c(ic3ab(e (abe( and in(ine e(e"ent i the hidden content that i
di&(ayed 'hen di&(ay e(e"ent i to,,(ed.
In%o
9a, inplace
*o"&onent *(a org.primefaces.component.inplace..nplace
*o"&onent 9y&e org.primefaces.component..nplace
Renderer 9y&e org.primefaces.component..nplaceenderer
Renderer *(a org.primefaces.component.inplace..nplaceenderer
Attributes
rendered.
(abe( nu(( Strin, 6abe( to be ho'n in di&(ay "ode.
e"&ty6abe( nu(( Strin, 6abe( to be ho'n in di&(ay "ode 'hen va(ue i
e"&ty.
e++ect +ade Strin, E++ect to be ued 'hen to,,(in,.
e++ectS&eed nor"a( Strin, S&eed o+ the e++ect.
diab(ed +a(e 1oo(ean !revent hidden content to be ho'n.
ty(e nu(( Strin, In(ine ty(e o+ the "ain container e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container e(e"ent.
editor +a(e 1oo(ean S&eci+ie the editor "ode.
249
ave6abe( Save Strin, 9oo(ti& te0t o+ ave buttin in editor "ode.
cance(6abe( *ance( Strin, 9oo(ti& te0t o+ cance( buttin in editor "ode.
event c(ic3 Strin, <a"e o+ the c(ient ide event to di&(ay in(ine
content.
to,,(eab(e true 1oo(ean De+ine i+ in&(ace i to,,(eab(e or not.
)ettin& Started with Inplace
9he in(ine co"&onent need to be a chi(d o+ in&(ace.
<p:inplace>
<h:input!e&t value'($dit me( />
</p:inplace>
$ustom *abels
1y de+au(t in&(ace di&(ay it +irt chi(d va(ue a the (abe(E you can cuto"i=e it via the (abe(
attribute.
<h:output!e&t value'(8elect One:( />
<p:inplace la-el'(ities(>
<h:selectOne5enu>
<f:selectItem item7a-el'(Istan-ul( item@alue'(Istan-ul( />
<f:selectItem item7a-el'(<n2ara( item@alue'(<n2ara( />
</h:selectOne5enu>
</p:inplace>
Facets
#or advanced cuto"i=ationE output and input +acet are &rovided.
<p:inplace id'(chec2-o&Inplace(>
<f:facet name'(output(>
"es or Jo
</f:facet>
<f:facet name'(input(>
<h:select=ooleanhec2-o& />
</f:facet>
</p:inplace>
250
/%%ects
De+au(t e++ect i fade and other &oib(e e++ect i slideE a(o e++ect &eed can be tuned 'ith va(ue
slowE normal and fast.
<p:inplace la-el'(8how Image( effect'(slide( effect8peed'(fast(>
</p:inplace>
/ditor
In&(ace editin, i enab(ed via the editor o&tion.
pu-lic class Inplace=ean /
//getter3setter
0
<p:inplace editor'(true(>
<h:input!e&t value'(./inplace=ean.te&t0( />
</p:inplace>

save and cancel are t'o &rovided a/a0 behavior event you can ue to hoo3Bin the editin, &roce.
pu-lic class Inplace=ean /
pu-lic void handle8ave9: /
//add faces message with update te&t value
0
//getter3setter
0
<p:inplace editor'(true(>
<p:a,a& event'(save( listener'(./inplace=ean.handle8ave0( update'(msgs( />
<h:input!e&t value'(./inplace=ean.te&t0( />
</p:inplace>
<p:growl id'(msgs( />
251
$lient Side API
Wid,etN PrimeFaces.widget.*nplace
ho'?@ B void Sho' content and hide di&(ay e(e"ent.
hide?@ B void Sho' di&(ay e(e"ent and hide content.
to,,(e?@ B void 9o,,(e viibi(ity o+ bet'een content and di&(ay
e(e"ent.
ave?@ B void 9ri,,er an a/a0 reCuet to &roce in&(ace in&ut.
cance(?@ B void 9ri,,er an a/a0 reCuet to revert in&(ace in&ut.
S+innin&
In&(ace reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i
)tyle #lass Applies
.uiBin&(ace 8ain container e(e"ent.
.uiBin&(aceBdiab(ed 8ain container e(e"ent 'hen diab(ed.
.uiBin&(aceBdi&(ay Di&(ay e(e"ent.
.uiBin&(aceBcontent In(ine content.
.uiBin&(aceBeditor Editor contro( container.
.uiBin&(aceBave Save button.
.uiBin&(aceBcance( *ance( button.
252
#.3' InputMas+
In&ut8a3 +orce an in&ut to +it in a de+ined "a3 te"&(ate.
In%o
9a, input!as,
*o"&onent *(a org.primefaces.component.inputmas,..nput!as,
*o"&onent 9y&e org.primefaces.component..nput!as,
Renderer 9y&e org.primefaces.component..nput!as,enderer
Renderer *(a org.primefaces.component.inputmas,..nput!as,enderer
Attributes
rendered.
"a3 nu(( Strin, 8a3 te"&(ate
&(ace.o(der nu(( Strin, !(ace.o(der in "a3 te"&(ate.
253
in,
va(idator nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a "ethod
va(ue*han,e6itener nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a "ethod
va(idation +ai(.
in&ut e(e"ent.
"a0(en,th nu(( Inte,er 8a0i"u" nu"ber o+ character that "ay be entered in
thi +ie(d.
(oe +ocu.
,ainin, +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent i
c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent i
doub(e c(ic3ed.
254
receive +ocu.
do'n over in&ut e(e"ent.
and re(eaed over in&ut e(e"ent.
over in&ut e(e"ent.
on"ouedo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i &reed do'n over in&ut e(e"ent
on"oue"ove nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved 'ithin in&ut e(e"ent.
on"oueout nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved a'ay +ro" in&ut e(e"ent.
on"oueover nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved onto in&ut e(e"ent.
on"oueu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i re(eaed over in&ut e(e"ent.
one(ect nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen te0t 'ithin in&ut
e(e"ent i e(ected by uer.
chan,e by the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the 'idth o+
the in&ut e(e"ent.
)ettin& Started with InputMas+
In&ut8a3 be(o' en+orce in&ut to be in 99Q99Q9999 date +or"at.
<p:input5as2 value'(./-ean.field0( mas2'(++/++/++++( />
255
Mas+ Samples
.ere are "ore a"&(e baed on di++erent "a3K
<h:output!e&t value'(#hone: ( />
<p:input5as2 value'(./-ean.phone0( mas2'(9+++: +++3++++(/>
<h:output!e&t value'(#hone with $&t: ( />
<p:input5as2 value'(./-ean.phone$&t0( mas2'(9+++: +++3++++M &+++++(/>
<h:output!e&t value'(88J: ( />
<p:input5as2 value'(./-ean.ssn0( mas2'(+++3++3++++(/>
<h:output!e&t value'(#roduct Tey: ( />
<p:input5as2 value'(./-ean.productTey0( mas2'(aW3+++3a+++(/>
S+innin&
style and styleClass o&tion a&&(y to the di&(ayed in&ut e(e"ent. A 3innin, ty(e c(ae are
,(oba(E ee the "ain the"in, ection +or "ore in+or"ation.
256
#.33 Input1e-t
In&ut9e0t i an e0tenion to tandard in&ut9e0t 'ith 3innin, ca&abi(itie.
In%o
9a, inputTe$t
*o"&onent *(a org.primefaces.component.inputte$t..nputTe$t
*o"&onent 9y&e org.primefaces.component..nputTe$t
Renderer 9y&e org.primefaces.component..nputTe$tenderer
Renderer *(a org.primefaces.component.inputte$t..nputTe$tender
Attributes
o+ a (itera( te0t
QStrin,
An e( e0&reion or a (itera( te0t that de+ine a converter +or
the co"&onent. When it an E6 e0&reionE it reo(ved to
a converter intance. In cae it a tatic te0tE it "ut re+er to
a converter id
E0&r
E0&r
A "ethod bindin, e0&reion that re+er to a "ethod +or
reCuired8ea,e nu(( Strin, 8ea,e to be di&(ayed a+ter +ai(ed va(idation.
257
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to the in&ut
e(e"ent.
diab(ed 0 1oo(ean Diab(e in&ut +ie(d
(an, nu(( Strin, *ode decribin, the (an,ua,e ued in the ,enerated "ar3u&
+or thi co"&onent.
"a0(en,th nu(( Inte,er 8a0i"u" nu"ber o+ character that "ay be entered in thi
+ie(d.
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent (oe
+ocu.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent (oe
+ocu and it va(ue ha been "odi+ied ince ,ainin, +ocu.
c(ic3ed.
doub(e c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute on in&ut e(e"ent +ocu.
over in&ut e(e"ent.
in&ut e(e"ent.
&reed do'n over in&ut e(e"ent
"oved 'ithin in&ut e(e"ent.
"oved a'ay +ro" in&ut e(e"ent.
258
"oved onto in&ut e(e"ent.
readon(y 0 1oo(ean #(a, indicatin, that thi co"&onent 'i(( &revent chan,e by
the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the 'idth o+ the
in&ut e(e"ent.
ty&e te0t Strin, In&ut +ie(d ty&e.
)ettin& Started with Input1e-t
In&ut9e0t ua,e i a"e a tandard in&ut9e0tK
<p:input!e&t value'(./-ean.propertyJame0( />
pu-lic class =ean /
private 8tring propertyJame;
//getter and setter
0
$lient Side API
Wid,etN PrimeFaces.widget.*nputTe$t
enab(e?@ B void Enab(e the in&ut +ie(d.
diab(e?@ B void Diab(e the in&ut +ie(d.
259
#.35 Input1e-tarea
In&ut9e0tarea i an e0tenion to tandard in&ut9e0tarea 'ith auto*o"&(eteE autoRei=eE re"ainin,
character counter and the"in, +eature.
In%o
9a, inputTe$tarea
*o"&onent *(a org.primefaces.component.inputte$tarea..nputTe$tarea
*o"&onent 9y&e org.primefaces.component..nputTe$tarea
Renderer 9y&e org.primefaces.component..nputTe$tareaenderer
Renderer *(a org.primefaces.component.inputte$tarea..nputTe$tareaender
Attributes
Strin,
An e( e0&reion or a (itera( te0t that de+ine a converter
+or the co"&onent. When it an E6 e0&reionE it
reo(ved to a converter intance. In cae it a tatic te0tE
it "ut re+er to a converter id
260
E0&r
E0&r
reCuired8ea,e nu(( Strin, 8ea,e to be di&(ayed 'hen reCuired +ie(d va(idation
+ai(.
e(e"ent.
+ocu.
+ocu and it va(ue ha been "odi+ied ince ,ainin,
+ocu.
c(ic3ed.
doub(e c(ic3ed.
receive +ocu.
over in&ut e(e"ent.
261
by the uer.
in&ut e(e"ent.
autoRei=e true 1oo(ean S&eci+ie auto ,ro'in, 'hen bein, ty&ed.
thi +ie(d.
counter nu(( Strin, Id o+ the out&ut co"&onent to di&(ay re"ainin, char.
counter9e"&(ate V0W Strin, 9e"&(ate te0t to di&(ay in counter.
co"&(ete8ethod nu(( 8ethod
E0&r
8ethod to &rovide u,,etion.
"iDuery6en,th ) Inte,er <u"ber o+ character to be ty&ed to run a Cuery.
CueryDe(ay 500 Inte,er De(ay in " be+ore endin, each Cuery.
cro((.ei,ht nu(( Inte,er .ei,ht o+ the vie'&ort +or autoco"&(ete u,,etion.
262
)ettin& Started with Input1e-tarea
In&ut9e0tarea ua,e i a"e a tandard in&ut9e0tareaK
<p:input!e&tarea value'(./-ean.propertyJame0( />
Auto"esi9e
Whi(e te0tarea i bein, ty&edE i+ content hei,ht e0ceed the a((ocated &aceE te0tarea can ,ro'
auto"atica((y. Ue autoRei=e o&tion to turn onQo++ thi +eature.
<p:input!e&tarea value'(./-ean.propertyJame0( autoCesiOe'(true[false(/>
"emainin& $haracters
In&ut9e0tarea can (i"it the "a0i"u" a((o'ed character 'ith "a06en,th o&tion and di&(ay the
re"ainin, character count a 'e((.
<p:input!e&tarea value'(./-ean.propertyJame0( counter'(display(
ma&length'(A0( counter!emplate'(/00 characters remaining( />
<h:output!e&t id'(display( />
Auto$omplete
In&ut9e0tarea u&&ort a/a0 autoco"&(ete +unctiona(ity a 'e((. Mou need to &rovide a
co"&(ete8ethod to &rovide the u,,etion to ue thi +eature. In a"&(e be(o'E co"&(eteArea
"ethod 'i(( be invo3ed 'ith the Cuery bein, the +our character be+ore the caret.
pu-lic class <utoomplete=ean /

pu-lic 7ist<8tring> complete<rea98tring Buery: /
7ist<8tring> results ' new <rray7ist<8tring>9:;
if9Buery.eBuals9(#rime6aces(:: /
results.add9(#rime6aces Coc2s!!!(:;
results.add9(#rime6aces has *00> components.(:;
results.add9(#rime6aces is lightweight.(:;
results.add9(#rime6aces is easy to use.(:;
results.add9(#rime6aces is developed with passion!(:;
0
else /
for9int i ' 0; i < *0; i>>: /
results.add9Buery > i:;
0
0
return results;
0
0
263
<p:input!e&tarea rows'(*0( cols'(50( minDuery7ength'(E(
complete5ethod'(./autoomplete=ean.complete<rea0( />
S+innin&
In&ut9e0tarea render a te0tarea e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i the
)tyle #lass Applies
uiBin&utte0tarea 9e0tarea e(e"ent.
uiBin&ut+ie(d 9e0tarea e(e"ent.
.uiBautoco"&(eteB&ane( 7ver(ay +or u,,etion.
.uiBautoco"&(eteBite" Su,,etion container.
.uiBautoco"&(eteBite" Each u,,etion.
264
#.36 @eyboard
;eyboard i an in&ut co"&onent that ue a virtua( 3eyboard to &rovide the in&ut. <otab(e +eature
are the cuto"i=ab(e (ayout and 3innin, ca&abi(itie.
In%o
9a, ,ey&oard
*o"&onent *(a org.primefaces.component.,ey&oard.5ey&oard
*o"&onent 9y&e org.primefaces.component.5ey&oard
Renderer 9y&e org.primefaces.component.5ey&oardenderer
Renderer *(a org.primefaces.component.,ey&oard.5ey&oardenderer
Attributes
rendered.
in,
265
va(idator nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a "ethod
va(ue*han,e6itener nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a "ethod
va(idation +ai(.
&a'ord +a(e 1oo(ean 8a3e the in&ut a &a'ord +ie(d.
ho'8ode +ocu Strin, S&eci+ie the ho'8odeE !+ocuE !buttonE !both
buttonI"a,e nu(( Strin, I"a,e +or the button.
buttonI"a,e7n(y +a(e boo(ean When et to true on(y i"a,e o+ the button 'ou(d be
di&(ayed.
e++ect +adeIn Strin, E++ect o+ the di&(ay ani"ation.
e++ectDuration nu(( Strin, 6en,th o+ the di&(ay ani"ation.
(ayout C'erty Strin, 1ui(tBin (ayout o+ the 3eyboard.
(ayout9e"&(ate nu(( Strin, 9e"&(ate o+ the cuto" (ayout.
3ey&ad7n(y +ocu 1oo(ean S&eci+ie di&(ayin, a 3ey&ad intead o+ a 3eyboard.
&ro"&t6abe( nu(( Strin, 6abe( o+ the &ro"&t te0t.
c(oe6abe( nu(( Strin, 6abe( o+ the c(oe 3ey.
c(ear6abe( nu(( Strin, 6abe( o+ the c(ear 3ey.
bac3&ace6abe( nu(( Strin, 6abe( o+ the bac3&ace 3ey.
in&ut e(e"ent.
266
"a0(en,th nu(( Inte,er 8a0i"u" nu"ber o+ character that "ay be entered
in thi +ie(d.
(oe +ocu.
,ainin, +ocu.
c(ic3ed.
doub(e c(ic3ed.
receive +ocu.
and re(eaed over in&ut e(e"ent.
on"ouedo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i &reed do'n over in&ut e(e"ent
on"oue"ove nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved 'ithin in&ut e(e"ent.
on"oueout nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved a'ay +ro" in&ut e(e"ent.
on"oueover nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i "oved onto in&ut e(e"ent.
on"oueu& nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a &ointer button
i re(eaed over in&ut e(e"ent.
chan,e by the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the 'idth o+
the in&ut e(e"ent.
267
)ettin& Started with @eyboard
;eyboard i ued /ut (i3e a i"&(e in&ut9e0tE by de+au(t 'hen the in&ut ,et the +ocu a 3eyboard i
di&(ayed.
<p:2ey-oard value'(./-ean.value0( />
.uilt>in *ayouts
9herere a cou&(e o+ bui(tBin 3eyboard (ayout thee are !C'ertyE !C'erty1aic and !a(&habetic. #or
e0a"&(e 3eyboard be(o' ha the a(&habetic (ayout.
<p:2ey-oard value'(./-ean.value0( layout'(alpha-etic(/>
$ustom *ayouts
;eyboard ha a very +(e0ib(e (ayout "echani" a((o'in, you to co"e u& 'ith your o'n (ayout.
<p:2ey-oard value'(./-ean.value0(
layout'(custom(
layout!emplate'(prime3-ac2Hfaces3clearHroc2s3close(/>
Another e0a"&(eK
<p:2ey-oard value'(./-ean.value0(
layout'(custom(
layout!emplate'(create3space3your3closeHowntemplate3shiftHeasily3space3
space-ar(/>
268
A (ayout te"&(ate baica((y conit o+ bui(tBin 3ey and your o'n 3ey. #o((o'in, i the (it o+ a((
bui(tBin 3ey.
G bac3
G c(ear
G c(oe
G hi+t
G &acebar
G &ace
G ha(+&ace
A(( other te0t in a (ayout i rea(i=ed a e&erate 3ey o I&ri"eI 'ou(d create 5 3ey a I&I IrI IiI
I"I IeI. Ue dah to e&erate each "e"ber in (ayout and ue co""a to create a ne' ro'.
@eypad
1y de+au(t 3eyboard di&(ay 'ho(e 3eyE i+ you on(y need the nu"ber ue the 3ey&ad "ode.
<p:2ey-oard value'(./-ean.value0( 2eypadOnly'(true(/>
ShowMode
9herere a cou&(e o+ di++erent 'ay to di&(ay the 3eyboardE by de+au(t 3eyboard i ho'n once
in&ut +ie(d receive the +ocu. 9hi i cuto"i=ed uin, the ho'8ode +eature 'hich acce&t va(ue
!+ocuE !buttonE !both. ;eyboard be(o' di&(ay a button ne0t to the in&ut +ie(dE 'hen the button i
c(ic3ed the 3eyboard i ho'n.
<p:2ey-oard value'(./-ean.value0( show5ode'(-utton(/>
1utton can a(o be cuto"i=ed uin, the button*mage and button*mage,nly attribute.
269
#.37 *ayout
6ayout co"&onent +eature a hi,h(y cuto"i=ab(e border6ayout "ode( "a3in, it very eay to
create co"&(e0 (ayout even i+ youre not +a"i(iar 'ith 'eb dei,n.
In%o
9a, layout
*o"&onent *(a org.primefaces.component.layout.*ayout
*o"&onent 9y&e org.primefaces.component.*ayout
Renderer 9y&e org.primefaces.component.*ayoutenderer
Renderer *(a org.primefaces.component.layout.*ayoutenderer
Attributes
+u((!a,e +a(e 1oo(ean S&eci+ie 'hether (ayout hou(d &an a(( &a,e or not.
270
ty(e nu(( Strin, Sty(e to a&&(y to container e(e"entE thi i on(y a&&(icab(e to
e(e"ent baed (ayout.
ty(e*(a nu(( Strin, Sty(e c(a to a&&(y to container e(e"entE thi i on(y a&&(icab(e
to e(e"ent baed (ayout.
onRei=e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a (ayout unit i rei=ed.
on*(oe nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a (ayout unit i c(oed.
on9o,,(e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a (ayout unit i to,,(ed.
rei=e9it(e nu(( Strin, 9it(e (abe( o+ the rei=e button.
co((a&e9it(e nu(( Strin, 9it(e (abe( o+ the co((a&e button.
e0&and9it(e nu(( Strin, 9it(e (abe( o+ the e0&and button.
c(oe9it(e nu(( Strin, 9it(e (abe( o+ the c(oe button.
)ettin& started with *ayout
6ayout i baed on a border6ayout "ode( that conit o+ 5 di++erent (ayout unit 'hich are to&E (e+tE
centerE ri,ht and botto". 9hi "ode( i viua(i=ed in the che"a be(o'K
Full Pa&e *ayout
6ayout ha t'o "odeE you can either ue it +or a +u(( &a,e (ayout or +or a &eci+ic re,ion in your
&a,e. 9hi ettin, i contro((ed 'ith the +u((!a,e attribute 'hich i +a(e by de+au(t.
9he re,ion in a (ayout are de+ined by (ayoutUnitE +o((o'in, i a i"&(e +u(( &a,e (ayout 'ith a((
&oib(e unit. <ote that you can &(ace any content in each (ayout unit.
271
<p:layout full#age'(true(>
<p:layoutKnit position'(north( siOe'(50(>
<h:output!e&t value'(!op content.( />
</p:layoutKnit>
<p:layoutKnit position'(south( siOe'(*00(>
<h:output!e&t value'(=ottom content.( />
</p:layoutKnit>
<p:layoutKnit position'(west( siOe'()00(>
<h:output!e&t value'(7eft content( />
</p:layoutKnit>
<p:layoutKnit position'(east( siOe'(A00(>
<h:output!e&t value'(Cight ontent( />
</p:layoutKnit>
<p:layoutKnit position'(center(>
<h:output!e&t value'(enter ontent( />
</p:layoutKnit>
</p:layout>
Forms in Full Pa&e *ayout
When 'or3in, 'ith +or" and +u(( &a,e (ayoutE avoid uin, a +or" that contain (ayoutunit a
,enerated do" "ay not be the a"e. So +o((o'in, i invalid.
<p:layout full#age'(true(>
<h:form>
<p:layoutKnit position'(west( siOe'(*00(>
h:output!e&t value'(7eft #ane( />
</p:layoutKnit>
<h:output!e&t value'(Cight #ane( />
</p:layoutKnit>
</h:form>
</p:layout>
A (ayout unit "ut have it o'n +or" inteadE a(o avoid tryin, to u&date (ayout unit becaue o+
a"e reaonE u&date it content intead.
Dimensions
E0ce&t center (ayoutUnitE other (ayout unit must have di"enion de+ined via si/e o&tion.
/lement based layout
Another ue cae o+ (ayout i the e(e"ent baed (ayout. 9hi i the de+au(t cae actua((y o /ut
i,nore +u((!a,e attribute or et it to +a(e. 6ayout e0a"&(e be(o' de"ontrate creatin, a &(it &ane(
i"&(e"entation.
272
<p:layout style'(width:E00p&;height:A00p&(>
<p:layoutKnit position'(west( siOe'(*00(>
<h:output!e&t value'(7eft #ane( />
</p:layoutKnit>
<h:output!e&t value'(Cight #ane( />
</p:layoutKnit>
//more layout units
</p:layout>
A,a- .ehaior /ents
6ayout &rovide cuto" a/a0 behavior event +or each (ayout tate chan,e.
to,,(e or,.&ri"e+ace.event.9o,,(eEvent When a unit i e0&anded or co((a&ed.
c(oe or,.&ri"e+ace.event.*(oeEvent When a unit i c(oed.
rei=e or,.&ri"e+ace.event.Rei=eEvent When a unit i rei=ed.
State%ul *ayout
8a3in, (ayout tate+u( 'ou(d be eayE once you create your data to tore the uer &re+erenceE you
can u&date thi data uin, a/a0 event (itener &rovided by (ayout. #or e0a"&(e i+ a (ayout unit i
co((a&edE you can ave and &erit thi in+or"ation. 1y bindin, thi &erited in+or"ation to the
co((a&ed attribute o+ the (ayout unit (ayout 'i(( be rendered a the uer (e+t it (at ti"e.
$lient Side API
Wid,etN PrimeFaces.widget.&ayout
to,,(e?&oition@ &oition void 9o,,(e (ayout unit.
ho'?&oition@ &oition void Sho' (ayout unit.
hide?unit@ &oition void .ide (ayout unit.
273
S+innin&
)tyle #lass Applies
.uiB(ayout 8ain 'ra&&er container e(e"ent
.uiB(ayoutBdoc 6ayout container
.uiB(ayoutBunit Each (ayout unit container
.uiB(ayoutBV&oitionW !oition baed (ayout unit
.uiB(ayoutBunitBheader 6ayout unit header
.uiB(ayoutBunitBcontent 6ayout unit body
274
#.38 *ayout4nit
6ayoutUnit re&reent a re,ion in the border (ayout "ode( o+ the 6ayout co"&onent.
In%o
9a, layout-nit
*o"&onent *(a org.primefaces.component.layout.*ayout-nit
*o"&onent 9y&e org.primefaces.component.*ayout-nit
Renderer 9y&e org.primefaces.component.*ayout-nitenderer
Renderer *(a org.primefaces.component.layout.*ayout-nitenderer
Attributes
be rendered.
&oition nu(( Strin, !oition o+ the unit.
i=e nu(( Strin, Si=e o+ the unit.
rei=ab(e +a(e 1oo(ean 8a3e the unit rei=ab(e.
c(oab(e +a(e 1oo(ean 8a3e the unit c(oab(e.
co((a&ib(e +a(e 1oo(ean 8a3e the unit co((a&ib(e.
header nu(( Strin, 9e0t o+ header.
+ooter nu(( Strin, 9e0t o+ +ooter.
"inSi=e nu(( Inte,er 8ini"u" di"enion +or rei=e.
"a0Si=e nu(( Inte,er 8a0i"u" di"enion +or rei=e.
,utter -&0 Strin, Gutter i=e o+ (ayout unit.
viib(e true 1oo(ean S&eci+ie de+au(t viibi(ity
co((a&ed +a(e 1oo(ean S&eci+ie to,,(e tatu o+ unit
co((a&eSi=e nu(( Inte,er Si=e o+ the unit 'hen co((a&ed
275
e++ect nu(( Strin, E++ect na"e o+ the (ayout tranition.
e++ectS&eed nu(( Strin, E++ect &eed o+ the (ayout tranition.
)ettin& started with *ayout4nit
See (ayout co"&onent docu"entation +or "ore in+or"ation re,ardin, the ua,e o+ (ayoutUnit.
Facets
In addition to header and footer attribute to di&(ay te0t at thee (ocationE +acet are a(o &rovided
'ith the a"e na"e to di&(ay cuto" content.
276
#.5: *i&ht.o-
6i,htbo0 i a &o'er+u( over(ay that can di&(ay i"a,eE "u(ti"edia contentE cuto" content and
e0terna( ur(.
In%o
9a, lig"t%o$
*o"&onent *(a org.primefaces.component lig"t&o$.*ig"t%o$
*o"&onent 9y&e org.primefaces.component.*ig"t%o$
Renderer 9y&e org.primefaces.component.*ig"t%o$enderer
Renderer *(a org.primefaces.component.lig"t&o$.*ig"t%o$enderer
Attributes
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE 'hen et
to +a(e co"&onent 'i(( not be rendered.
in a bac3in, bean
ty(e nu(( Strin, Sty(e o+ the container e(e"ent not the over(ay e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the container e(e"ent not the over(ay e(e"ent.
'idth nu(( Strin, Width o+ the over(ay in i+ra"e "ode.
277
hei,ht nu(( Strin, .ei,ht o+ the over(ay in i+ra"e "ode.
i+ra"e +a(e 1oo(ean S&eci+ie an i+ra"e to di&(ay an e0terna( ur( in over(ay.
i+ra"e9it(e nu(( Strin, 9it(e o+ the i+ra"e e(e"ent.
viib(e +a(e 1oo(ean Di&(ay (i,htbo0 'ithout reCuirin, any uer interaction by de+au(t.
on.ide nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (i,htbo0 i di&(ayed.
onSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (i,htbo0 i hidden.
Ima&es
9he i"a,e di&(ayed in the (i,ht1o0 need to be neted a chi(d out&ut6in3 co"&onent. #o((o'in,
(i,ht1o0 i di&(ayed 'hen any o+ the (in3 are c(ic3ed.
<p:light=o&>
<h:output7in2 value'(sopranos/sopranos*.,pg( title'(8opranos *(>
<h:graphicImage value'(sopranos/sopranos*Lsmall.,pg/>
</h:output7in2>
<h:output7in2 value'(sopranos/sopranosA.,pg( title'(8opranos A(>
<h:graphicImage value'(sopranos/sopranosALsmall.,pg/>
</h:output7in2>
<h:output7in2 value'(sopranos/sopranos).,pg( title'(8opranos )(>
<h:graphicImage value'(sopranos/sopranos)Lsmall.,pg/>
</h:output7in2>
//more
</p:light=o&>
IFrame Mode
6i,ht1o0 a(o ha the abi(ity to di&(ay i+ra"e inide the &a,e over(ayE +o((o'in, (i,htbo0 di&(ay
the !ri"e#ace ho"e&a,e 'hen the (in3 inide i c(ic3ed.
<p:light=o& iframe'(true(>
<h:output7in2 value'(http://www.primefaces.org( title'(#rime6aces 4ome#age(>
<h:output!e&t value'(#rime6aces 4ome#age(/>
</h:output7in2>
</p:light=o&>
*(ic3in, the out&ut6in3 'i(( di&(ay !ri"e#ace ho"e&a,e 'ithin an i+ra"e.
Inline Mode
In(ine "ode act (i3e a "oda( dia(o,E you can di&(ay other AS# content on the &a,e uin, the
(i,htbo0 over(ay. Si"&(y &(ace your over(ay content in the Iin(ineI +acet. *(ic3in, the (in3 in the
e0a"&(e be(o' 'i(( di&(ay the &ane(Grid content in over(ay.
278
<p:light=o&>
<h:output7in2 value'(.( title'(7eo 5essi( >
<h:output!e&t value'(!he 5essiah(/>
</h:output7in2>
<f:facet name'(inline(>
//content here
</f:facet>
</p:light=o&>
6i,htbo0 in(ine "ode doent u&&ort advanced content (i3e co"&(e0 'id,et. Ue a dia(o, intead
+or advanced cae invo(vin, cuto" content.
$lient Side API
Wid,etN PrimeFaces.widget.&ight)o$
ho'?@ B void Di&(ay (i,htbo0.
hide?@ B void .ide (i,htbo0.
ho'UR6?o&t@ o&t void Di&(ay a UR6 in a i+ra"e. o&t &ara"eter ha three
variab(e. 'idth and hei,ht +or i+ra"e di"enion
and rc +or the &a,e ur(.
S+innin&
6i,htbo0 reide in a "ain container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i
)tyle #lass Applies
.uiB(i,htbo0 8ain container e(e"ent.
.uiB(i,htbo0BcontentB'ra&&er *ontent 'ra&&er e(e"ent.
.uiB(i,htbo0Bcontent *ontent container.
.uiB(i,htbo0BnavBri,ht <e0t i"a,e navi,ator.
.uiB(i,htbo0BnavB(e+t !reviou i"a,e navi,ator.
.uiB(i,htbo0B(oadin, 6oadin, i"a,e.
.uiB(i,htbo0Bca&tion *a&tion e(e"ent.
279
#.51 *in+
6in3 i an e0tenion to tandard hN(in3 co"&onent.
In%o
9a, lin,
*o"&onent *(a org.primefaces.component.lin,.*in,
*o"&onent 9y&e org.primefaces.component.*in,
Renderer 9y&e org.primefaces.component.*in,enderer
Renderer *(a org.primefaces.component.lin,.*in,enderer
Attributes
rendered true 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onent.
o+ a (itera( te0t.
outco"e nu(( Strin, Ued to reo(ve a navi,ation cae.
inc(ude>ie'!ara" +a(e 1oo(ean Whether to inc(ude &a,e &ara"eter in tar,et URI
+ra,"ent nu(( Strin, Identi+ier o+ the tar,et &a,e 'hich hou(d be cro((ed to.
diab(ed +a(e 1oo(ean Diab(e button.
diab(e*(ientWindo' +a(e 1oo(ean Diab(e a&&endin, the *(ientWindo' on the renderin, o+
thi e(e"ent.
acce3ey nu(( Strin, Acce 3ey that 'hen &reed tran+er +ocu to button.
charet nu(( Strin, *haracter encodin, o+ the reource dei,nated by thi
hy&er(in3.
coord nu(( Strin, !oition and ha&e o+ the hot &ot on the creen +or c(ient
ue in i"a,e "a&.
hre+(an, nu(( Strin, 6an,ua,e code o+ the reource dei,nated by the (in3.
280
re( nu(( Strin, Re(ationhi& +ro" the current docu"ent to the anchor
&eci+ied by the (in3E va(ue are &rovided by a &aceB
rev nu(( Strin, A revere (in3 +ro" the anchor &eci+ied by thi (in3 to the
current docu"entE va(ue are &rovided by a &aceBe&arated
(it o+ (in3 ty&e.
ha&e nu(( Strin, Sha&e o+ hot &ot on the creenE va(id va(ue are de+au(tE
rectE circ(e and &o(y.
tabinde0 nu(( Strin, !oition o+ the e(e"ent in the tabbin, order.
tar,et nu(( Strin, <a"e o+ a +ra"e 'here the reource tar,eted by thi (in3
'i(( be di&(ayed.
ty&e nu(( Strin, 9y&e o+ reource re+erenced by the (in3.
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button receive +ocu.
over button.
button.
"oved 'ithin button
"oved onto button.
281
hre+ nu(( Strin, In(ine ty(e o+ the button.
eca&e true 1oo(ean De+ine i+ (abe( o+ the co"&onent i eca&ed or not.
)ettin& Started with *in+
&N(in3 ua,e i a"e a tandard hN(in3E an outco"e i neceary to navi,ate uin, GE9 reCuet.
Au"e you are at ource.0ht"( and need to navi,ate tar,et.0ht"(.
<p:lin2 outcome'(target( value'(Javigate(/>
9o navi,ate 'ithout outco"e baed a&&roachE ue hre+ attribute.
<p:lin2 href'(http://www.primefaces.org( value'(Javigate(/>
282
#.52 *o&
6o, co"&onent i a viua( cono(e to di&(ay (o, on AS# &a,e.
In%o
9a, log
*o"&onent *(a org.primefaces.component.log.*og
*o"&onent 9y&e org.primefaces.component.*og
Renderer 9y&e org.primefaces.component.*ogenderer
Renderer *(a org.primefaces.component.log.*ogenderer
Attributes
be rendered.
)ettin& started with *o&
6o, co"&onent i ued i"&(y a addin, the co"&onent to the &a,e.
<p:log />
283
*o& API
!ri"e#ace ue c(ient ide (o, a&i interna((yE +or e0a"&(e you can ue (o, co"&onent to ee
detai( o+ an a/a0 reCuet. 6o, A!I i a(o avai(ab(e via ,(oba( !ri"e#ace ob/ect in cae youd (i3e
to ue the (o, co"&onent to di&(ay your (o,.
<script type']te&t/,avascript]>
#rime6aces.info9Înfo message_:;
#rime6aces.de-ug9^De-ug message_:;
#rime6aces.warn9^1arning message_:;
#rime6aces.error9^$rror message_:;
</script>
$lient Side API
Wid,etN PrimeFaces.widget.&og
ho'?@ B void Sho' the container e(e"ent.
hide?@ B void .ide the container e(e"ent.
284
#.5# Media
8edia co"&onent i ued +or e"beddin, "u(ti"edia content.

In%o
9a, media
*o"&onent *(a org.primefaces.component.media.!edia
*o"&onent 9y&e org.primefaces.component.!edia
Renderer 9y&e org.primefaces.component.!ediaenderer
Renderer *(a org.primefaces.component.media.!ediaenderer
Attributes
rendered.
va(ue nu(( Strin, 8edia ource to &(ay.
&(ayer nu(( Strin, 9y&e o+ the &(ayerE &oib(e va(ue are
ICuic3ti"eIEI'indo'IEI+(ahIEIrea(I and I&d+I.
'idth nu(( Strin, Width o+ the &(ayer.
hei,ht nu(( Strin, .ei,ht o+ the &(ayer.
ty(e nu(( Strin, Sty(e o+ the &(ayer.
ty(e*(a nu(( Strin, Sty(e*(a o+ the &(ayer.
cache true 1oo(ean *ontro( bro'er cachin, "ode o+ the reource.
)ettin& started with Media
In it i"&(et +or" "edia co"&onent reCuire a ource to &(ayK
<p:media value'(/media/riaLwithLprimefaces.mov( />
285
Player 1ypes
1y de+au(tE &(ayer are identi+ied uin, the va(ue e0tenion o +or intance "ov +i(e 'i(( be &(ayed
by Cuic3ti"e &(ayer. Mou can cuto"i=e 'hich &(ayer to ue 'ith the &(ayer attribute.
<p:media value'(http://www.youtu-e.com/v/<=D$6I4( player'(flash(/>
#o((o'in, i the u&&orted &(ayer and +i(e ty&e.
Player Types
'indo' a0E a+E aviE '"aE '"v
Cuic3ti"e ai+E ai++E aacE auE b"&E ,"E "ovE "idE "idiE "&,E "&e,E "&-E "-aE &dE CtE Cti+E Ci+E
CtiE ndE ti+E ti++E 'avE ),%E )&,
+(ah +(vE "&)E '+
rea( raE ra"E r"E r&"E rvE "iE "i(
&d+ &d+
Parameters
Di++erent &ro&rietary &(ayer "i,ht have di++erent con+i,uration &ara"eterE thee can be &eci+ied
uin, +N&ara" ta,.
<p:media value'(/media/riaLwithLprimefaces.mov(>
<f:param name'(param*( value'(value*( />
</p:media>
Streamed$ontent Support
8edia co"&onent can a(o &(ay binary "edia contentE e0a"&(e +or thi ue cae i torin, "edia
+i(e in databae uin, binary +or"at. In order to i"&(e"ent thiE bind a Strea"ed*ontent.
<p:media value'(./media=ean.media0( width'(A50( height'(AA5( player'(Buic2time(/>
pu-lic class 5edia=ean /
private 8treamedontent media;
pu-lic 5ediaontroller9: /
Input8tream stream ' //reate -inary stream from data-ase
media ' new Default8treamedontent9streamH (video/Buic2time(:;
0
pu-lic 8treamedontent get5edia9: / return media; 0
0
286
#.5' Me&aMenu
8e,a8enu i a hori=onta( navi,ation co"&onent that di&(ay ub"enu to,ether.
In%o
9a, mega!enu
*o"&onent *(a org.primefaces.component.megamenu.!ega!enu
*o"&onent 9y&e org.primefaces.component.!ega!enu
Renderer 9y&e org.primefaces.component.!ega!enuenderer
Renderer *(a org.primefaces.component.megamenu.!ega!enuenderer
Attributes
be rendered.
&ro,ra""atica((y
287
autoDi&(ay true 1oo(ean De+ine 'hether ub"enu 'i(( be di&(ayed on
"oueover or not. When et to +a(eE c(ic3 event
i reCuired to di&(ay.
activeInde0 nu(( Inte,er Inde0 o+ the active root "enu to di&(ay a
hi,h(i,hted. 1y de+au(t no root i hi,h(i,hted.
)ettin& Started with Me&aMenu
6ayout o+ 8e,a8enu i ,rid baed and root ite" reCuire co(u"n a chi(dren to de+ine each
ection in a ,rid.
<p:mega5enu>
<p:su-menu la-el'(!@( icon'(ui3icon3chec2(>
<p:column>
<p:su-menu la-el'(!@.*(>
<p:menuitem value'(!@.*.*( url'(.( />
<p:menuitem value'(!@.*.A( url'(.( />
</p:su-menu>
<p:su-menu la-el'(!@.A(>
<p:menuitem value'(!@.A.*( url'(.( />
<p:menuitem value'(!@.A.A( url'(.( />
<p:menuitem value'(!@.A.)( url'(.( />
</p:su-menu>
<p:su-menu la-el'(!@.)(>
<p:menuitem value'(!@.).*( url'(.( />
<p:menuitem value'(!@.).A( url'(.( />
</p:su-menu>
</p:column>

<p:column>
<p:su-menu la-el'(!@.E(>
<p:menuitem value'(!@.E.*( url'(.( />
<p:menuitem value'(!@.E.A( url'(.( />
</p:su-menu>
<p:su-menu la-el'(!@.5(>
<p:menuitem value'(!@.5.*( url'(.( />
<p:menuitem value'(!@.5.A( url'(.( />
<p:menuitem value'(!@.5.)( url'(.( />
</p:su-menu>
<p:su-menu la-el'(!@.U(>
<p:menuitem value'(!@.U.*( url'(.( />
<p:menuitem value'(!@.U.A( url'(.( />
<p:menuitem value'(!@.U.)( url'(.( />
</p:su-menu>
</p:column>
</p:su-menu>
//more root items
</p:mega5enu>
288
$ustom $ontent
Any content can be &(aced inide co(u"n.
<p:column>
<strong>8opranos</strong>
<p:graphicImage value'(/images/sopranos/sopranos*.,pg( width'(A00(/>
</p:column>
"oot Menuitem
8e,a8enu u&&ort "enuite" a root "enu o&tion a 'e((. #o((o'in, e0a"&(e a((o' a root
"enubar ite" to e0ecute an action to (o,out the uer.
<p:mega5enu>
//su-menus
<p:menuitem la-el'(7ogout( action'(./-ean.logout0(/>
</p:mega5enu>
Dynamic Menus
S+innin&
8e,a8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB"e,a"enu *ontainer e(e"ent o+ "enubar.
289
#.53 Menu
8enu i a navi,ation co"&onent 'ith ub"enu and "enuite".
In%o
9a, menu
*o"&onent *(a org.primefaces.component.menu.!enu
*o"&onent 9y&e org.primefaces.component.!enu
Renderer 9y&e org.primefaces.component.!enuenderer
Renderer *(a org.primefaces.component.menu.!enuenderer
Attributes
"ode( nu(( 8enu8ode( A "enu "ode( intance to create "enu &ro,ra""atica((y.
tri,,er nu(( Strin, 9ar,et co"&onent to attach the over(ay "enu.
290
"y nu(( Strin, *orner o+ "enu to a(i,n 'ith tri,,er e(e"ent.
at nu(( Strin, *orner o+ tri,,er to a(i,n 'ith "enu e(e"ent.
over(ay +a(e 1oo(ean De+ine &oitionin, ty&e o+ "enuE either tatic or over(ay.
tri,,erEvent c(ic3 Strin, Event to ho' the dyna"ic &oitioned "enu.
)ettin& started with the Menu
A "enu i co"&oed o+ ub"enu and "enuite".
<p:menu>
<p:menuitem value'(Imail( url'(http://www.google.com( />
<p:menuitem value'(4otmail( url'(http://www.hotmail.com( />
<p:menuitem value'("ahoo 5ail( url'(http://mail.yahoo.com( />
<p:menuitem value'("outu-e( url'(http://www.youtu-e.com( />
<p:menuitem value'(=rea2( url'(http://www.-rea2.com( />
<p:menuitem value'(5etacafe( url'(http://www.metacafe.com( />
<p:menuitem value'(6ace-oo2( url'(http://www.face-oo2.com( />
<p:menuitem value'(5y8pace( url'(http://www.myspace.com( />
</p:menu>
Sub"enu are ued to ,rou& "enuite"K
291
<p:menu>
<p:su-menu la-el'(5ail(>
</p:su-menu>
<p:su-menu la-el'(@ideos(>
<p:menuitem value'(5etacafe( url'(http://www.metacafe.com( />
</p:su-menu>
<p:su-menu la-el'(8ocial Jetwor2s(>
<p:menuitem value'(6ace-oo2( url'(http://www.face-oo2.com( />
<p:menuitem value'(5y8pace( url'(http://www.myspace.com( />
</p:su-menu>
</p:menu>
;erlay Menu
8enu can be &oitioned on a &a,e in t'o 'ayK ItaticI and Idyna"icI. 1y de+au(t it tatic
"eanin, the "enu i in nor"a( &a,e +(o'. In contrat dyna"ic "enu i not on the nor"a( +(o' o+
the &a,e a((o'in, the" to over(ay other e(e"ent.
A dyna"ic "enu i created by ettin, overlay o&tion to true and de+inin, a tri,,er to ho' the
"enu. 6ocation o+ "enu on &a,e 'i(( be re(ative to the tri,,er and de+ined by "y and at o&tion
that ta3e co"bination o+ +our va(ueK
G (e+t
G ri,ht
G botto"
G to&
292
#or e0a"&(eE c(ic3in, the button be(o' 'i(( di&(ay the "enu 'hoe to& (e+t corner i a(i,ned 'ith
botto" (e+t corner o+ button.
<p:menu overlay'(true( trigger'(-tn( my'(left top( at'(-ottom left(>
...su-menus and menuitems
</p:menu>
<p:command=utton id'(-tn( value'(8how 5enu( type'(-utton(/>
A,a- and 0on>A,a- Actions
A "enu ue "enuite"E it i eay to invo3e action 'ith or 'ithout a/a0 a 'e(( a navi,ation.
See "enuite" docu"entation +or "ore in+or"ation about the ca&abi(itie.
<p:menu>
<p:su-menu la-el'(Options(>
<p:menuitem value'(8ave( action7istener'(./-ean.save0( update'(comp(/>
<p:menuitem value'(Kpdate( action7istener'(./-ean.update0( a,a&'(false(/>
<p:menuitem value'(Javigate( url'(http://www.primefaces.org(/>
</p:su-menu>
</p:menu>
Dynamic Menus
8enu can be created &ro,ra""atica((y a 'e((E thi i "ore +(e0ib(e co"&ared to the dec(arative
a&&roach. 8enu "etadata i de+ined uin, an org.primefaces.model.-enu-odel intanceE
!ri"e#ace &rovide the bui(tBin org.primefaces.model.'efault-enu-odel i"&(e"entation.
#or +urther cuto"i=ation you can a(o create and bind your o'n 8enu8ode( i"&(e"entation. ?e.,.
7ne 'ith A!A bEntity annotation to ab(e ab(e to &erit to a databae@.
<p:menu model'(./menu=ean.model0( />
293
pu-lic class 5enu=ean /
private 5enu5odel model;
pu-lic 5enu=ean9: /
model ' new Default5enu5odel9:;
//6irst su-menu
Default8u-5enu first8u-menu ' new Default8u-5enu9(Dynamic 8u-menu(:;
Default5enuItem item ' new Default5enuItem9($&ternal(:;
item.setKrl9(http://www.primefaces.org(:;
item.setIcon9(ui3icon3home(:;
first8u-menu.add$lement9item:;
model.add$lement9first8u-menu:;
//8econd su-menu
Default8u-5enu second8u-menu ' new Default8u-5enu9(Dynamic <ctions(:;
item ' new Default5enuItem9(8ave(:;
item.setIcon9(ui3icon3dis2(:;
item.setommand9(./menu=ean.save0(:;
item.setKpdate9(messages(:;
second8u-menu.add$lement9item:;
item ' new Default5enuItem9(Delete(:;
item.setIcon9(ui3icon3close(:;
item.setommand9(./menu=ean.delete0(:;
item.set<,a&9false:;
item ' new Default5enuItem9(Cedirect(:;
item.setIcon9(ui3icon3search(:;
item.setommand9(./menu=ean.redirect0(:;
model.add$lement9second8u-menu:;
0
pu-lic 5enu5odel get5odel9: / return model; 0
0
#or a(( UI co"&onent counter&art uch a &N"enuite"E &Nub"enuE &Ne&arator a corre&ondin,
inter+ace 'ith a de+au(t i"&(e"entation e0it in 8enu8ode( A!I. Re,ardin, actionE i+ you need to
&a &ara"eter in a/a0 or nonBa/a0 co""andE ue et!ara"?3eyE va(ue@ "ethod.'
8enu8ode( A!I i u&&orted by a(( "enu co"&onent that have "ode( attribute.
294
S+innin&
8enu reide in a "ain container e(e"ent 'hich style and styleClass attribute a&&(y. #o((o'in, i
)tyle #lass Applies
.uiB"enu *ontainer e(e"ent o+ "enu
.uiB"enuB(idin, *ontainer o+ i&od (i3e (idin, "enu
295
#.55 Menubar
8enubar i a hori=onta( navi,ation co"&onent.
In%o
9a, menu&ar
*o"&onent *(a org.primefaces.component.menu&ar.!enu&ar
*o"&onent 9y&e org.primefaces.component.!enu&ar
Renderer 9y&e org.primefaces.component.!enu&arenderer
Renderer *(a org.primefaces.component.menu&ar.!enu&arenderer
Attributes
be rendered.
&ro,ra""atica((y
ty(e nu(( Strin, In(ine ty(e o+ "enubar
ty(e*(a nu(( Strin, Sty(e c(a o+ "enubar
autoDi&(ay +a(e 1oo(ean De+ine 'hether the +irt (eve( o+ ub"enu 'i((
be di&(ayed on "oueover or not. When
et to +a(eE c(ic3 event i reCuired to di&(ay.
296
)ettin& started with Menubar
Sub"enu and "enuite" a chi(d co"&onent are reCuired to co"&oe the "enubar.
<p:menu-ar>
<p:su-menu la-el'(5ail(>
</p:su-menu>
<p:su-menu la-el'(@ideos(>
</p:su-menu>
</p:menu-ar>
0ested Menus
9o create a "enubar 'ith a hi,her de&thE net ub"enu in &arent ub"enu.
<p:menu-ar>
<p:su-menu la-el'(6ile(>
<p:su-menu la-el'(Jew(>
<p:menuitem value'(#ro,ect( url'(.(/>
<p:menuitem value'(Other( url'(.(/>
</p:su-menu>
<p:menuitem value'(Open( url'(.(></p:menuitem>
<p:menuitem value'(Duit( url'(.(></p:menuitem>
</p:su-menu>
<p:su-menu la-el'($dit(>
<p:menuitem value'(Kndo( url'(.(></p:menuitem>
<p:menuitem value'(Cedo( url'(.(></p:menuitem>
</p:su-menu>
<p:su-menu la-el'(4elp(>
<p:menuitem la-el'(ontents( url'(.( />
<p:su-menu la-el'(8earch(>
<p:su-menu la-el'(!e&t(>
<p:menuitem value'(1or2space( url'(.( />
</p:su-menu>
<p:menuitem value'(6ile( url'(.( />
</p:su-menu>
</p:su-menu>
</p:menu-ar>
"oot Menuitem
8enubar u&&ort "enuite" a root "enu o&tion a 'e((K
<p:menu-ar>
<p:menuitem la-el'(7ogout( action'(./-ean.logout0(/>
</p:menu-ar>
297
A,a- and 0on>A,a- Actions
A "enu ue "enuite"E it i eay to invo3e action 'ith or 'ithout a/a0 a 'e(( a navi,ation.
See "enuite" docu"entation +or "ore in+or"ation about the ca&abi(itie.
<p:menu-ar>
<p:su-menu la-el'(Options(>
<p:menuitem value'(8ave( action7istener'(./-ean.save0( update'(comp(/>
<p:menuitem value'(Kpdate( action7istener'(./-ean.update0( a,a&'(false(/>
<p:menuitem value'(Javigate( url'(http://www.primefaces.org(/>
</p:su-menu>
</p:menu-ar>
Dynamic Menus
S+innin&
8enubar reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB"enubar *ontainer e(e"ent o+ "enubar.
298
#.56 Menu.utton
8enu1utton di&(ay di++erent co""and in a &o&u& "enu.
In%o
9a, menu%utton
*o"&onent *(a org.primefaces.component.menu&utton.!enu%utton
*o"&onent 9y&e org.primefaces.component.!enu%utton
Renderer 9y&e org.primefaces.component.!enu%uttonenderer
Renderer *(a org.primefaces.component.menu&utton.!enu%uttonenderer
Attributes
va(ue nu(( Strin, 6abe( o+ the button
ty(e nu(( Strin, Sty(e o+ the "ain container e(e"ent
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container e(e"ent
"ode( nu(( 8enu8ode( 8enu8ode( intance to create "enu &ro,ra""atica((y
diab(ed +a(e 1oo(ean Diab(e or enab(e the button.
icon!o (e+t Strin, !oition o+ the iconE va(id va(ue are (e+t and ri,ht.
a&&end9o nu(( Strin, A&&end the over(ay to the e(e"ent de+ined by earch
e0&reion. De+au(t to docu"ent body.
299
)ettin& started with the Menu.utton
8enu1utton conit o+ one ore "ore "enuite". #o((o'in, "enubutton e0a"&(e ha three
"enuite"E +irt one i ued tri,,er an action 'ith a/a0E econd one doe the i"i(ar but 'ithout
a/a0 and third one i ued +or redirect &ur&oe.
<p:menu=utton value'(Options(>
<p:menuitem value'(8ave( action7istener'(./-ean.save0( update'(comp( />
<p:menuitem value'(Kpdate( action7istener'(./-ean.update0( a,a&'(false( />
<p:menuitem value'(Io 4ome( url'(/home.,sf( />
</p:menu=utton>
Dynamic Menus
S+innin&
8enu1utton reide in a "ain container 'hich style and styleClass attribute a&&(y. A 3innin,
)tyle #lass Applies
.uiB"enu *ontainer e(e"ent o+ "enu.
300
#.57 MenuItem
8enuIte" i ued by variou "enu co"&onent.

In%o
9a, menu.tem
9a, *(a org.primefaces.component.menuitem.!enu.temTag
*o"&onent *(a org.primefaces.component.menuitem.!enu.tem
*o"&onent 9y&e org.primefaces.component.!enu.tem
Attributes
rendered.
va(ue nu(( Strin, 6abe( o+ the "enuite"
action6itener nu(( 8ethod
E0&r
Action (itener to be invo3ed 'hen "enuite" i c(ic3ed.
action nu(( 8ethod
E0&r
Action to be invo3ed 'hen "enuite" i c(ic3ed.
i""ediate +a(e 1oo(ean When trueE action o+ thi "enuite" i &roceed a+ter
a&&(y reCuet &hae.
ur( nu(( Strin, Ur( to be navi,ated 'hen "enuite" i c(ic3ed
tar,et nu(( Strin, 9ar,et ty&e o+ ur( navi,ation
ty(e nu(( Strin, Sty(e o+ the "enuite" (abe(
ty(e*(a nu(( Strin, Sty(e*(a o+ the "enuite" (abe(
onc(ic3 nu(( Strin, Aavacri&t event hand(er +or c(ic3 event
&roce nu(( Strin, *o"&onent to &roce &artia((y intead o+ 'ho(e vie'.
u&date nu(( Strin, *o"&onent to u&date a+ter a/a0 reCuet.
301
diab(ed +a(e 1oo(ean Diab(e the "enuite".
ontart nu(( Strin, Aavacri&t hand(er to e0ecute be+ore a/a0 reCuet i
be,in.
co"&(eted.
onucce nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet
ucceed.
onerror nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet +ai(.
a/a0Statu.
reCuet are dicarded. I+ thi o&tion i not &eci+iedE or
i+ the va(ue o+ delay i the (itera( trin, OnoneO 'ithout the
a/a0 true 1oo(ean S&eci+ie ub"it "ode.
icon nu(( Strin, !ath o+ the "enuite" i"a,e.
outco"e nu(( Strin, <avi,ation cae outco"e.
inc(ude>ie'!ara" +a(e 1oo(ean De+ine i+ &a,e &ara"eter hou(d be in tar,et URI.
+ra,"ent nu(( Strin, Identi+ier o+ the tar,et &a,e e(e"ent to cro(( to.
diab(e*(ientWindo' +a(e 1oo(ean Diab(e a&&endin, the *(ientWindo' on the renderin,
o+ thi e(e"ent.
containerSty(e nu(( Strin, In(ine ty(e o+ the "enuite" container.
containerSty(e*(a nu(( Strin, Sty(e c(a o+ the "enuite" container.
302
)ettin& started with MenuItem
8enuIte" i a ,eneric co"&onent ued by the +o((o'in, co"&onent.
G 8enu
G 8enu1ar
G 8e,a8enu
G 1readcru"b
G Doc3
G Stac3
G 8enu1utton
G S&(it1utton
G !ane(8enu
G 9ab8enu
G S(ide8enu
G 9iered8enu
<ote that o"e attribute o+ "enuite" "i,ht not be u&&orted by thee "enu co"&onent. Re+er to
the &eci+ic co"&onent docu"entation +or "ore in+or"ation.
0ai&ation s Action
8enuite" ha t'o ue caeE direct(y navi,atin, to a ur( 'ith GE9 or doin, a !7S9 to e0ecute an
action. 9hi i decided by ur( or outco"e attributeE i+ either one i &reent "enuite" doe a GE9
reCuetE i+ not &arent +or" i &oted 'ith or 'ithout a/a0 decided by a#a$ attribute.
Icons
9here are t'o 'ay to &eci+y an icon o+ a "enuite"E you can either ue bund(ed icon 'ithin
!ri"e#ace or &rovide your o'n via c.
9he"eRo((er Icon
<p:menuitem icon'(ui3icon3dis2( ... />
*uto" Icon
<p:menuitem icon'(-arca( ... />
.-arca /
-ac2ground: url9-arcaLlogo.png: no3repeat;
height:*Up&;
width:*Up&;
0
303
#.58 Messa&e
8ea,e i a &reB3inned e0tended verion o+ the tandard AS# "ea,e co"&onent.

In%o
9a, message
*o"&onent *(a org.primefaces.component.message.!essage
*o"&onent 9y&e org.primefaces.component.!essage
Renderer 9y&e org.primefaces.component.!essageenderer
Renderer *(a org.primefaces.component.message.!essageenderer
Attributes
ho'Su""ary +a(e 1oo(ean S&eci+ie i+ the u""ary o+ the #ace8ea,e hou(d be
di&(ayed.
ho'Detai( true 1oo(ean S&eci+ie i+ the detai( o+ the #ace8ea,e hou(d be
di&(ayed.
+or nu(( Strin, Id o+ the co"&onent 'hoe "ea,e to di&(ay.
redi&(ay true 1oo(ean De+ine i+ a(ready rendered "ea,e hou(d be di&(ayed
di&(ay both Strin, De+ine the di&(ay "ode.
304
)ettin& started with Messa&e
8ea,e ua,e i e0act(y a"e a tandard "ea,e.
<h:input!e&t id'(t&t( value'(./-ean.te&t0( />
<p:message for'(t&t( />
Display Mode
8ea,e co"&onent ha three di++erent di&(ay "odeK
G te0t N 7n(y "ea,e te0t i di&(ayed.
G icon N 7n(y "ea,e everity i di&(ayed and "ea,e te0t i viib(e a a too(ti&.
G both ?de+au(t@ N 1oth icon and te0t are di&(ayed.
Seerity *eels
intanceE you can con+i,ure "ea,e to on(y di&(ay in+o and 'arnin,.
<p:message severity'(infoHwarn( for'(t&t(/>
/scapin&
*o"&onent eca&e ht"( content in "ea,e by de+au(tE in cae you need to di&(ay ht"(E diab(e
eca&e o&tion.
<p:message escape'(false( for'(t&t( />
S+innin&
#u(( (it o+ *SS e(ector o+ "ea,e i a +o((o'K
)tyle #lass Applies
uiB"ea,eBVeverityW *ontainer e(e"ent o+ the "ea,e
uiB"ea,eBVeverityWBu""ary Su""ary te0t
uiB"ea,eBVeverityWBdetai( Detai( te0t
VeverityW can be !in+oE !errorE !'arn and error.
305
#.6: Messa&es
8ea,e i a &reB3inned e0tended verion o+ the tandard AS# "ea,e co"&onent.

In%o
9a, messages
*o"&onent *(a org.primefaces.component.messages.!essages
*o"&onent 9y&e org.primefaces.component.!essages
Renderer 9y&e org.primefaces.component.!essagesenderer
Renderer *(a org.primefaces.component.messages.!essagesenderer
Attributes
rendered.
ho'Su""ary true 1oo(ean S&eci+ie i+ the u""ary o+ the #ace8ea,e
hou(d be di&(ayed.
ho'Detai( +a(e 1oo(ean S&eci+ie i+ the detai( o+ the #ace8ea,e hou(d
be di&(ayed.
,(oba(7n(y +a(e Strin, When trueE on(y +ace"ea,e 'ith no c(ientId are
di&(ayed.
redi&(ay true 1oo(ean De+ine i+ a(ready rendered "ea,e hou(d be
di&(ayed
autoU&date +a(e 1oo(ean Enab(e auto u&date "ode i+ et true.
+or nu(( Strin, <a"e o+ aociated 3eyE ta3e &recedence 'hen ued
'ith ,(oba(7n(y.
306
c(oab(e +a(e 1oo(ean Add a c(oe icon to hide the "ea,e.
ho'Icon true 1oo(ean De+ine i+ everity icon 'ou(d be di&(ayed.
)ettin& started with Messa&es
8ea,e ua,e i e0act(y a"e a tandard "ea,e.
<p:messages />
Auto4pdate
When auto u&date i enab(edE "ea,e co"&onent i u&dated 'ith each a/a0 reCuet auto"atica((y.
1ar&etable Messa&es
9here "ay be ti"e 'here you need to tar,et one or "ore "ea,e to a &eci+ic "ea,e
co"&onentE +or e0a"&(e u&&oe you have ,ro'( and "ea,e on a"e &a,e and you need to
di&(ay o"e "ea,e on ,ro'( and o"e on "ea,e. Ue +or attribute to aociate "ea,e
'ith &eci+ic co"&onent.
<p:messages for'(some2ey( />
<p:growl for'(another2ey( />
6acesonte&t conte&t ' 6acesonte&t.geturrentInstance9:;
conte&t.add5essage9(some2ey(H faces5essage*:;
conte&t.add5essage9(some2ey(H faces5essageA:;
conte&t.add5essage9(another2ey(H faces5essage):;
In a"&(e aboveE "ea,e 'i(( di&(ay +irt and econd "ea,e and ,ro'( 'i(( on(y di&(ay the
)rd "ea,e.
Seerity *eels
intanceE you can con+i,ure "ea,e to on(y di&(ay in+o and 'arnin,.
<p:messages severity'(infoHwarn( />
307
/scapin&
8ea,e eca&e ht"( content in "ea,eE diab(e eca&e o&tion to di&(ay content a ht"(.
<p:messages escape'(false( />
S+innin&
#u(( (it o+ *SS e(ector o+ "ea,e i a +o((o'K
)tyle #lass Applies
uiB"ea,eBVeverityW *ontainer e(e"ent o+ the "ea,e
uiB"ea,eBVeverityWBu""ary Su""ary te0t
uiB"ea,eBVeverityWBdetai( Detai( te0t
uiB"ea,eBVeverityWBicon Icon o+ the "ea,e.
VeverityW can be !in+oE !errorE !'arn and error.
308
#.61 Mindmap
8ind"a& i an interactive too( to viua(i=e "ind"a& data +eaturin, (a=y (oadin,E ca((bac3E
ani"ation and "ore.
In%o
9a, mindmap
*o"&onent *(a org.primefaces.component.mindmap.!indmap
*o"&onent 9y&e org.primefaces.component.!indmap
Renderer 9y&e org.primefaces.component.!indmapenderer
Renderer *(a org.primefaces.component.mindmap.!indmapenderer
Attributes
be rendered.
309
va(ue nu(( 8ind"a&<ode 8enu8ode( intance to bui(d "enu dyna"ica((y.
e++ectS&eed )00 Inte,er S&eed o+ the ani"ation in "i((iecond.
)ettin& started with Mindmap
8ind"a& reCuire an intance o+ org.primefaces.model.mindmap.-indmap=ode a the root. Due to
it (a=y natureE a e(ect a/a0 behavior "ut be &rovided to (oad chi(dren o+ e(ected node on the +(y
'ith a/a0.
pu-lic class 5indmap=ean /

private 5indmapJode root;

pu-lic 5indmap=ean9: /
root ' new Default5indmapJode9(google.com(H (Ioogle(H (6600(H false:;

5indmapJode ips ' new Default5indmapJode9(I#s(H (I# Jos(H (Ue+e-f(H true:;
5indmapJode ns ' new Default5indmapJode9(J89s:(H (James(H (Ue+e-f(H true:;
5indmapJode mw ' new Default5indmapJode9(5w(H (5alicious (H (Ue+e-f(H true:;

root.addJode9ips:;
root.addJode9ns:;
root.addJode9malware:;
0
pu-lic 5indmapJode getCoot9: /
return root;
0
pu-lic void onJode8elect98elect$vent event: /
5indmapJode node ' 95indmapJode: event.getO-,ect9:;
//load children of select node and add via node.addJode9childJode:;
0
0
<p:mindmap value'(./mindmap=ean.root0( style'(width:*00F;height:U00p&(>
<p:a,a& event'(select( listener'(./mindmap=ean.onJode8elect0( />
</p:mindmap>
310
Double$lic+ .ehaior
Se(ectin, a node 'ith in,(e c(ic3 i ued to (oad ubnodeE doub(e c(ic3 behavior i a(o &rovided
+or +urther cuto"i=ation. #o((o'in, a"&(eE di&(ay the detai( o+ the ubnode in a dia(o,.
<p:mindmap value'(./mindmap=ean.root0( style'(width:*00F;height:U00p&;(>
<p:a,a& event'(select( listener'(./mindmap=ean.onJode8elect0( />
<p:a,a& event'(d-lselect( listener'(./mindmap=ean.onJodeD-lselect0(
update'(output( oncomplete'(#69?details?:.show9:(/>
</p:mindmap>
<p:dialog widget@ar'(details( header'(Jode Details( resiOa-le'(false( modal'(true(
show$ffect'(fade( hide$ffect'(fade(>
<h:output!e&t id'(output( value'(./mindmap=ean.selectedJode.data0( />
</p:dialog>
pu-lic void onJodeD-lselect98elect$vent event: /
this.selectedJode ' 95indmapJode: event.getO-,ect9:;
0
Mindmap0ode API
org.primefaces.model.mindmap.-indmap=ode
(abe( nu(( Strin, 6abe( o+ the node.
data nu(( 7b/ect 7&tiona( data aociated 'ith the node.
+i(( nu(( Strin, *o(or code o+ the node.
e(ectab(e 1 1oo(ean #(a, to de+ine i+ node i c(ic3ab(e.
&arent nu(( 8ind"a&<ode !arent node intance.
1ips
G IE 5 and IE 2 are not u&&orted due to technica( (i"itationE IE 9 i u&&orted.
311
3."2 #ulti-electLi)tbox
8u(tiSe(ect6itbo0 i ued to e(ect an ite" +ro" a co((ection o+ (itbo0e that are in &arentBchi(d
re(ationhi&.
In%o
9a, multi)elect*ist&o$
*o"&onent *(a org.primefaces.component.multiselectlist&o$.!ulti)elect*ist&o$
*o"&onent 9y&e org.primefaces.component.!ulti)elect*ist&o$
Renderer 9y&e org.primefaces.component.!ulti)elect*ist&o$enderer
Renderer *(a org.primefaces.component.multiselectlist&o$.!ulti)elect*ist&o$enderer
Attributes
rendered.
diab(ed +a(e 1oo(ean I+ trueE diab(e the co"&onent.
e++ect nu(( Strin, E++ect to ue 'hen ho'in, a ,rou& o+ ite".
312
)ettin& started with MultiSelect*istbo-
8u(tiSe(ect6itbo0 need a co((ection o+ Se(ectIte"Grou&.
pu-lic class 5ulti8elect7ist-o&=ean /

private 7ist<8electItem> categories;
private 8tring selection;
Z#ostonstruct
pu-lic void init9: /
categories ' new <rray7ist<8electItem>9:;
8electItemIroup group* ' new 8electItemIroup9(Iroup *(:;
8electItemIroup groupA ' new 8electItemIroup9(Iroup A(:;
8electItemIroup group) ' new 8electItemIroup9(Iroup )(:;
8electItemIroup groupE ' new 8electItemIroup9(Iroup E(:;

8electItemIroup group** ' new 8electItemIroup9(Iroup *.*(:;
8electItemIroup group*A ' new 8electItemIroup9(Iroup *.A(:;

8electItemIroup groupA* ' new 8electItemIroup9(Iroup A.*(:;

8electItem option)* ' new 8electItem9(Option ).*(H (Option ).*(:;
8electItem option)A ' new 8electItem9(Option ).A(H (Option ).A(:;
8electItem option)) ' new 8electItem9(Option ).)(H (Option ).)(:;
8electItem option)E ' new 8electItem9(Option ).E(H (Option ).E(:;

8electItem optionE* ' new 8electItem9(Option E.*(H (Option E.*(:;

8electItem option*** ' new 8electItem9(Option *.*.*(:;
8electItem option**A ' new 8electItem9(Option *.*.A(:;
group**.set8electItems9new 8electItemQS/option***H option**A0:;

8electItem option*A* ' new 8electItem9(Option *.A.*(H (Option *.A.*(:;
8electItem option*AA ' new 8electItem9(Option *.A.A(H (Option *.A.A(:;
8electItem option*A) ' new 8electItem9(Option *.A.)(H (Option *.A.)(:;
group*A.set8electItems9new 8electItemQS/option*A*H option*AAH option*A)0:;

8electItem optionA** ' new 8electItem9(Option A.*.*(H (Option A.*.*(:;
groupA*.set8electItems9new 8electItemQS/optionA**0:;

group*.set8electItems9new 8electItemQS/group**H group*A0:;
groupA.set8electItems9new 8electItemQS/groupA*0:;
group).set8electItems9new 8electItemQS/option)*H option)AH option))H
option)E0:;
groupE.set8electItems9new 8electItemQS/optionE*0:;

categories.add9group*:;
categories.add9groupA:;
categories.add9group):;
categories.add9groupE:;
0

//getters3setters of categories and selection
0
313
<p:multi8elect7ist-o& value'(./multi8elect7ist-o&=ean.selection0(>
<f:selectItems value'(./multi8elect7ist-o&=ean.categories0( />
</p:multi8elect7ist-o&>
<ote that Se(ectIte"Grou& are not e(ectab(eE on(y va(ue o+ Se(ectIte" can be &aed to the bean.
/%%ects
An ani"ation i e0ecuted durin, to,,(in, o+ a ,rou&E +o((o'in, o&tion are avai(ab(e +or effect
attributeK b(indE bounceE c(i&E dro&E e0&(odeE +o(dE hi,h(i,htE &u++E &u(ateE ca(eE ha3eE i=eE (ide
?u,,eted@.
$lient Side API
Wid,etN PrimeFaces.widget.-ultiSelect&istbo$
enab(e?@ B void Enab(e the co"&onent.
diab(e?@ B void Diab(e the co"&onent.
ho'Ite"Grou&?ite"@ (i e(e"ent a
/Duery ob/ect
void Sho' ubcate,orie o+ a ,iven ite".
S+innin&
8u(tiSe(ect6itbo0 reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiB"u(tie(ect(itbo0 8ain container e(e"ent.
.uiB"u(tie(ect(itbo0B(it 6it container.
.uiB"u(tie(ect(itbo0Bite" Each ite" in a (it.
314
#.6# 0oti%ication.ar
<oti+ication1ar di&(ay a "u(ti&ur&oe +i0ed &oitioned &ane( +or noti+ication.
In%o
9a, notification%ar
*o"&onent *(a org.primefaces.component.notification&ar.Notification%ar
*o"&onent 9y&e org.primefaces.component.Notificaton%ar
Renderer 9y&e org.primefaces.component.Notification%arenderer
Renderer *(a org.primefaces.component.notification&ar.Notification%arenderer
Attributes
be rendered.
ty(e nu(( Strin, Sty(e o+ the container e(e"ent
ty(e*(a nu(( Strin, Sty(e*(a o+ the container e(e"ent
&oition to& Strin, !oition o+ the barE Ito&I or Ibotto"I.
e++ect +ade Strin, <a"e o+ the e++ectE I+adeIE I(ideI or InoneI.
e++ectS&eed nor"a( Strin, S&eed o+ the e++ectE I(o'IE Inor"a(I or I+atI.
autoDi&(ay +a(e 1oo(ean When trueE &ane( i di&(ayed on &a,e (oad.
)ettin& started with 0oti%ication.ar
A noti+ication1ar i a &ane( co"&onentE any content can be &(aced inide.
<p:notification=ar>
//ontent
</p:notification=ar>
315
Showin& and (idin&
9o ho' and hide the contentE noti+ication1ar &rovide an eay to ue c(ient ide a&i that can be
acceed throu,h the 'id,et>ar. show! di&(ay the bar and hide! hide it. is2isible! and toggle!
are additiona( c(ient ide a&i "ethod.
<p:notification=ar widget@ar'(nv(>
//ontent
<h:output7in2 value'(.( onclic2'(#69?nv?:.show9:(>8how</h:output7in2>
<h:output7in2 value'(.( onclic2'(#69?nv?:.hide9:(>4ide</h:output7in2>
<ote that noti+ication1ar ha a de+au(t bui(tBin c(oe icon to hide the content.
/%%ects
De+au(t e++ect to be ued 'hen di&(ayin, and hidin, the bar i I+adeIE another &oib(e e++ect i
I(ideI.
<p:notification=ar effect'(slide(>
//ontent
I+ youd (i3e to turn o++ ani"ationE et e++ect na"e to InoneI. In addition duration o+ the ani"ation i
contro((ed via e++ectS&eed attribute that can ta3e Inor"a(IE I(o'I or I+atI a it va(ue.
Position
De+au(t &oition o+ bar i Ito&IE other &oibi(ity i &(acin, the bar at the botto" o+ the &a,e. <ote
that bar &oitionin, i +i0ed o even &a,e i cro((edE bar 'i(( not cro((.
<p:notification=ar position'(-ottom(>
//ontent
S+innin&
ty(e and ty(e*(a attribute a&&(y to the "ain container e(e"ent. Additiona((y there are t'o &reB
de+ined c e(ector ued to cuto"i=e the (oo3 and +ee(.
)elector Applies
.uiBnoti+icationbar 8ain container e(e"ent
.uiBnoti+icationbarBc(oe *(oe icon e(e"ent
316
#.6' ;rder*ist
7rder6it i ued to ort a co((ection +eaturin, dra,:dro& baed reorderin,E tranition e++ect and
&o/o u&&ort.
In%o
9a, order*ist
*o"&onent *(a org.primefaces.component.orderlist.6rder*ist
*o"&onent 9y&e org.primefaces.component.6rder*ist
Renderer 9y&e org.primefaces.component.6rder*istenderer
Renderer *(a org.primefaces.component.orderlist.6rder*istenderer
Attributes
rendered 9rue 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE
va(ue nu(( 7b/ect >a(ue o+ the co"&onent re+errin, to a 6it.
QStrin,
317
i""ediate 0 1oo(ean When et trueE &roce va(idation (o,ic i e0ecuted at
reCuired 0 1oo(ean 8ar3 co"&onent a reCuired
E0&r
A "ethod e0&reion that re+er to a "ethod va(idation,
the in&ut
E0&r
A "ethod e0&reion that re+er to a "ethod +or hand(in,
a va(uechan,eevent
+ai(.
var nu(( Strin, <a"e o+ the iterator.
ite"6abe( nu(( Strin, 6abe( o+ an ite".
ite">a(ue nu(( Strin, >a(ue o+ an ite".
ty(e nu(( Strin, In(ine ty(e o+ container e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ container e(e"ent.
diab(ed 0 1oo(ean Diab(e the co"&onent.
e++ect +ade Strin, <a"e o+ ani"ation to di&(ay.
"oveU&6abe( 8ove U& Strin, 6abe( o+ "ove u& button.
"ove9o&6abe( 8ove
9o&
Strin, 6abe( o+ "ove to& button.
"oveDo'n6abe( 8ove
Do'n
Strin, 6abe( o+ "ove do'n button.
"ove1otto"6abe( 8ove
1otto"
Strin, 6abe( o+ "ove botto" button.
contro(6ocation (e+t Strin, 6ocation o+ the reorder buttonE va(id va(ue are (e+tE
ri,ht and none.
)ettin& started with ;rder*ist
318
A (it i reCuired to ue 7rder6it co"&onent.
pu-lic class Order7ist=ean /
private 7ist<8tring> cities;
pu-lic Order7ist=ean9: /
cities ' new <rray7ist<8tring>9:;
cities.add9(Istan-ul(:;
cities.add9(<n2ara(:;
cities.add9(IOmir(:;
cities.add9(<ntalya(:;
cities.add9(=ursa(:;
0
//getterRsetter for cities
0
<p:order7ist value'(./order7ist=ean.cities0( var'(city(
item7a-el'(./city0( item@alue'(./city0((/>
Adanced ;rder*ist
7rder6it u&&ort di&(ayin, cuto" content intead o+ i"&(e (abe( by uin, co(u"n. In
additionE &o/o are u&&orted i+ a converter i de+ined.
pu-lic class Order7ist=ean /
private 7ist<#layer> players;
players ' new <rray7ist<#layer>9:;
players.add9new #layer9(5essi(H *0H (messi.,pg(::;
players.add9new #layer9(Iniesta(H GH (iniesta.,pg(::;
players.add9new #layer9(@illa(H PH (villa.,pg(::;
players.add9new #layer9(Navi(H UH (&avi.,pg(::;
0
//getterRsetter for players
0
<p:order7ist value'(./order7ist=ean.players0( var'(player( item@alue'(./player0(
converter'(player(>
<p:column style'(width:A5F(>
<p:graphicImage value'(/images/-arca/./player.photo0( />
</p:column>
<p:column style'(width:P5F;(>
./player.name0 3 ./player.num-er0
</p:column>
</p:order7ist>
319
(eader
A +acet ca((ed ca&tion i &rovided to di&(ay a header content +or the order(it.
/%%ects
An ani"ation i e0ecuted durin, reorderin,E de+au(t e++ect i +ade and +o((o'in, o&tion are
avai(ab(e +or effect attributeK b(indE bounceE c(i&E dro&E e0&(odeE +o(dE hi,h(i,htE &u++E &u(ateE ca(eE
ha3eE i=e and (ide.
S+innin&
7rder6it reide in a "ain container 'hich style and styleClass attribute a&&(y. A 3innin, ty(e
c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBorder(it 8ain container e(e"ent.
.uiBorder(itB(it *ontainer o+ ite".
.uiBorder(itBite" Each ite" in the (it.
.uiBorder(itBca&tion *a&tion o+ the (it.
320
#.63 ;utput*abel
7ut&ut6abe( i a an e0tenion to the tandard out&ut6abe( co"&onent.
In%o
9a, output*a&el
*o"&onent *(a org.primefaces.component.outputla&el.6utput*a&el
*o"&onent 9y&e org.primefaces.component.6utput*a&el
Renderer 9y&e org.primefaces.component.6utput*a&elenderer
Renderer *(a org.primefaces.component.outputla&el.6utput*a&elenderer
Attributes
va(ue nu(( Strin, 6abe( to di&(ay.
acce3ey nu(( Strin, 9he acce3ey attribute i a tandard .986 attribute that
et the acce 3ey that tran+er +ocu to thi e(e"ent 'hen
&reed.
eca&e true 1oo(ean De+ine i+ va(ue hou(d be eca&ed or not.
321
+or nu(( Strin, *o"&onent to attach the (abe( to.
tabinde0 nu(( Strin, !oition in tabbin, order.
onb(ur nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen co"&onent (oe
+ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen co"&onent i c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen co"&onent i doub(e
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen co"&onent receive
+ocu.
over co"&onent.
re(eaed over co"&onent.
co"&onent.
&reed do'n over co"&onent.
"oved a'ay +ro" co"&onent.
"oved onto co"&onent.
re(eaed over co"&onent.
)ettin& Started with ;utput*abel
Ua,e i a"e a tandard out&ut6abe(E an in&ut co"&onent i aociated 'ith +or attribute.
<p:output7a-el for'(input( value'(7a-el( />
<p:input!e&t id'(input( value'(./-ean.te&t0( />
322
Auto *abel
7ut&ut6abe( et it va(ue a the (abe( o+ the tar,et co"&onent to be di&(ayed in va(idation error
o the tar,et co"&onent doe not need to de+ine the (abe( attribute a,ain.
<h:output7a-el for'(input( value'(6ield( />
<p:input!e&t id'(input( value'(./-ean.te&t0( la-el'(6ield(/>
can be re'ritten aK
<p:output7a-el for'(input( value'(6ield( />
<p:input!e&t id'(input( value'(./-ean.te&t0( />
Support %or Adanced $omponents
So"e !ri"e#ace in&ut co"&onent (i3e &innerE autoco"&(ete doe not render /ut baic in&ut o
tandard out&ut6abe( co"&onent cannot a&&(y +ocu to theeE ho'ever !ri"e#ace out&ut6abe( can.
<h:output7a-el for'(input( value'(ant apply focus( />
<p:output7a-el for'(input( value'(an apply focus( />
<p:spinner id'(input( value'(./-ean.te&t0( />
<alidations
When the tar,et in&ut i reCuiredE out&ut6abe( di&(ay J y"bo( ne0t to the va(ue. In cae any
va(idation +ai( on tar,et in&utE (abe( 'i(( a(o be di&(ayed 'ith the"e a'are error ty(e.
S+innin&
6abe( render a (abe( e(e"ent that style and styleClass attribute a&&(y. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBout&ut(abe( 6abe( e(e"ent
.uiBtateBerror 6abe( e(e"ent 'hen in&ut i inva(id
.uiBout&ut(abe(Br+i ReCuired +ie(d indicator.
323
#.65 ;utputPanel
7ut&ut!ane( i a &ane( co"&onent 'ith the abi(ity to auto u&date.
In%o
9a, outputPanel
*o"&onent *(a org.primefaces.component.outputpanel.6utputPanel
*o"&onent 9y&e org.primefaces.component.6utputPanel
Renderer 9y&e org.primefaces.component.6utputPanelenderer
Renderer *(a org.primefaces.component.output.6utputPanelenderer
Attributes
be rendered.
ty(e nu(( Strin, Sty(e o+ the ht"( container e(e"ent
ty(e*(a nu(( Strin, Sty(e*(a o+ the ht"( container e(e"ent
(ayout b(oc3 Strin, Shortcut +or the c di&(ay &ro&ertyE va(id va(ue
are b(oc3 ?de+au(t@ and in(ine.
autoU&date +a(e 1oo(ean Enab(e auto u&date "ode i+ et true.
de+erred +a(e 1oo(ean De+erred "ode (oad the content a+ter &a,e (oad
to &eed u& &a,e (oad.
de+erred8ode (oad Strin, De+ine de+erred (oadin, "odeE va(id va(ue are
I(oadI ?a+ter &a,e (oad@ and Iviib(eI ?once the
&ane( i viib(e on cro((@.
,(oba( +a(e 1oo(ean G(oba( a/a0 reCuet are (itened by a/a0Statu
a/a0Statu on de+erred (oadin,.
324
Place(older
When a AS# co"&onent i not renderedE no "ar3u& i rendered o +or co"&onent 'ith conditiona(
renderin,E re,u(ar u&date "echani" "ay not 'or3 ince the "ar3u& to u&date on &a,e doe not
e0it. 7ut&ut!ane( i ue+u( in thi cae to be ued a a &(aceho(der.
Su&&oe the rendered condition on bean i +a(e 'hen &a,e i+ (oaded initia((y and earch "ethod on
bean et the condition to be true "eanin, datatab(e 'i(( be rendered a+ter a &a,e ub"it. 9he
&rob(e" i a(thou,h &artia( out&ut i ,eneratedE the "ar3u& on &a,e cannot be u&dated ince it
doent e0it.
<p:data!a-le id'(t-l( rendered'(./-ean.condition0( ...>
//columns
</p:data!a-le>
<p:command=utton update'(t-l( action7istener'(./-ean.search0( />
So(ution i to ue the out&ut!ane( a a &(ace.o(der.
<p:output#anel id'(out(>
<p:data!a-le id'(t-l( rendered'(./-ean.condition0( ...>
//columns
</p:data!a-le>
</p:output#anel>
<p:command=utton update'(out( action7istener'(./-ean.list0( />
<ote that you 'ont need an out&ut!ane( i+ co""and1utton ha no u&date attribute &eci+iedE in
thi cae &arent +or" 'i(( be u&dated &artia((y i"&(icit(y "a3in, an out&ut!ane( ue obe(ete.
De%erred *oadin&
When thi +eature o&tion i enab(edE content o+ &ane( i not (oaded a(on, 'ith the &a,e but (oaded
a+ter the &a,e on de"and. Initia((y &ane( di&(ay a (oadin, ani"ation a+ter &a,e (oad to indicate
"ore content i co"in, u& and di&(ay content 'ith a/a0 u&date. Uin, deferred-ode o&tionE it i
&oib(e to (oad content not /ut a+ter &a,e (oad ?de+au(t "ode@ but 'hen it beco"e viib(e on
&a,e cro(( a 'e((. 9hi +eature i very ue+u( to increae &a,e (oad &er+or"anceE au"e you have
one &art o+ the &a,e that ha co"&onent dea(in, 'ith bac3end and ta3in, ti"eE 'ith de+erred "ode
onE ret o+ the &a,e i (oaded intant(y and ti"e ta3in, &roce i (oaded a+ter'ard 'ith a/a0.
*ayout
7ut&ut!ane( ha t'o (ayout "odeK
G b(oc3 ?de+au(t@N Render a div
G in(ineN Render a &an
Auto4pdate
When auto u&date i enab(edE out&ut!ane( co"&onent i u&dated 'ith each a/a0 reCuet
auto"atica((y.
S+innin&
style and styleClass attribute are ued to ty(e the out&ut!ane(E by de+au(t .ui1outputpanel c c(a
i added to e(e"ent and .ui1outputpanel1loading 'hen content i (oadin, in de+erred (oadin, cae.
325
#.66 ;erlayPanel
7ver(ay!ane( i a ,eneric &ane( co"&onent that can be di&(ayed on to& o+ other content.
In%o
9a, overlayPanel
*o"&onent *(a org.primefaces.component.overlaypanel.6verlayPanelenderer
*o"&onent 9y&e org.primefaces.component.6verlayPanel
Renderer 9y&e org.primefaces.component.6verlayPanelenderer
Renderer *(a org.primefaces.component.overlaypanel.6verlayPanelenderer
Attributes
rendered.
ty(e nu(( Strin, In(ine ty(e o+ the &ane(.
ty(e*(a nu(( Strin, Sty(e c(a o+ the &ane(.
+or nu(( Strin, 9ar,et co"&onent to di&(ay &ane( ne0t to.
ho'Event c(ic3 Strin, Event on tar,et to ho' the &ane(.
326
hideEvent c(ic3 Strin, Event on tar,et to hide the &ane(.
ho'E++ect nu(( Strin, Ani"ation to di&(ay 'hen ho'in, the &ane(.
hideE++ect nu(( Strin, Ani"ation to di&(ay 'hen hidin, the &ane(.
a&&end9o1ody 0 1oo(ean When trueE &ane( i a&&ended to docu"ent body.
onSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen &ane( i ho'n.
on.ide nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen &ane( i hidden.
"y (e+t to& Strin, !oition o+ the &ane( re(ative to the tar,et.
at (e+t botto" Strin, !oition o+ the tar,et re(ative to the &ane(.
dyna"ic +a(e 1oo(ean De+ine content (oadin, "ode.
di"iab(e true 1oo(ean When et trueE c(ic3in, outide o+ the &ane( hide the
over(ay.
ho'*(oeIcon +a(e 1oo(ean Di&(ay a c(oe icon to hide the over(ayE de+au(t i +a(e.
)ettin& started with ;erlayPanel
7ver(ay!ane( need a co"&onent a a tar,et in addition to the content to di&(ay. E0a"&(e be(o'
de"ontrate an over(ay!ane( attached to a button to ho' a chart in a &o&u&.
<p:command=utton id'(chart=tn( value'(=asic( type'(-utton( />

<p:overlay#anel for'(chart=tn(>
<p:piehart value'(./chart=ean.pie5odel0( legend#osition'(w(
title'(8ample #ie hart( style'(width:E00p&;height:)00p&( />
</p:overlay#anel>
/ents
De+au(t event on tar,et to ho' and hide the &ane( i "ouedo'n. 9hee are cuto"i=ed uin,
showEvent and hideEvent o&tion.
<p:command=utton id'(chart=tn( value'(=asic( type'(-utton( />

<p:overlay#anel show$vent'(mouseover( hide$vent'(mousedown(>
//content
</p:overlay#anel>
/%%ects
b(indE bounceE c(i&E dro&E e0&(odeE +o(dE hi,h(i,htE &u++E &u(ateE ca(eE ha3eE i=eE (ide are
avai(ab(e va(ue +or showEffect and hideEffect o&tion i+ youd (i3e di&(ay ani"ation.
327
Positionin&
1y de+au(tE (e+t to& corner o+ &ane( i a(i,ned to (e+t botto" corner o+ the tar,et i+ there i enou,h
&ace in 'indo' vie'&ortE i+ not the &oition i +(i&&ed on the +(y to +ind the bet (ocation to
di&(ay. In order to cuto"i=e the &oition ue my and at o&tion that ta3e co"bination o+ (e+tE
ri,htE botto" and to& e.,. ri,ht botto".
Dynamic Mode
Dyna"ic "ode enab(e (a=y (oadin, o+ the contentE in thi "ode content o+ the &ane( i not rendered
on &a,e (oad and (oaded /ut be+ore &ane( i ho'n. A(o content i cached o conecutive di&(ay
do not (oad the content a,ain. 9hi +eature i ue+u( to reduce the &a,e i=e and reduce &a,e (oad
ti"e.
S+innin&
!ane( reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBover(ay&ane( 8ain container e(e"ent o+ &ane(
1ips
G Enab(e a&&end9o1ody 'hen over(ay!ane( i in other &ane( co"&onent (i3e (ayoutE dia(o, ...
I+ there i a co"&onent 'ith a &o&u& (i3e ca(endarE autoco"&(ete &(aced inide the over(ay &ane(E
&o&u& &art "i,ht e0ceed the boundarie o+ &ane( and c(ic3in, the outide hide the &ane(. 9hi i
undeirab(e o in cae (i3e thi ue over(ay!ane( 'ith
dismissable +a(e and o&tiona(
showClose*con ettin,.
328
#.67 Panel
!ane( i a ,rou&in, co"&onent 'ith content to,,(eE c(oe and "enu inte,ration.
In%o
9a, panel
*o"&onent *(a org.primefaces.component.panel.Panel
*o"&onent 9y&e org.primefaces.component.Panel
Renderer 9y&e org.primefaces.component.Panelenderer
Renderer *(a org.primefaces.component.panel.Panelenderer
Attributes
be rendered.
header nu(( Strin, .eader te0t
+ooter nu(( Strin, #ooter te0t
to,,(eab(e +a(e 1oo(ean 8a3e &ane( to,,(eab(e.
to,,(eS&eed 1000 Inte,er S&eed o+ to,,(in, in "i((iecond
co((a&ed +a(e 1oo(ean Render a to,,(eab(e &ane( a co((a&ed.
ty(e nu(( Strin, Sty(e o+ the &ane(
ty(e*(a nu(( Strin, Sty(e c(a o+ the &ane(
329
c(oab(e +a(e 1oo(ean 8a3e &ane( c(oab(e.
c(oeS&eed 1000 Inte,er S&eed o+ c(oin, e++ect in "i((iecond
viib(e true 1oo(ean Render &ane( a viib(e.
c(oe9it(e nu(( Strin, 9oo(ti& +or the c(oe button.
to,,(e9it(e nu(( Strin, 9oo(ti& +or the to,,(e button.
"enu9it(e nu(( Strin, 9oo(ti& +or the "enu button.
to,,(e7rientation vertica( Strin, De+ine the orientation o+ the to,,(in,E va(id
va(ue are vertica( and hori=onta(.
)ettin& started with Panel
!ane( enca&u(ate other co"&onent.
<p:panel>
//hild components here...
</p:panel>
(eader and Footer
.eader and #ooter te0t can be &rovided by header and footer attribute or the corre&ondin, +acet.
When a"e attribute and +acet na"e are uedE +acet 'i(( be ued.
<p:panel header'(4eader !e&t(>
<h:output!e&t value'(6ooter !e&t( />
</f:facet>
</p:panel>
A,a- .ehaior /ents
!ane( &rovide cuto" a/a0 behavior event +or to,,(in, and c(oin, +eature.
to,,(e or,.&ri"e+ace.event.9o,,(eEvent When &ane( i e0&anded or co((a&ed.
c(oe or,.&ri"e+ace.event.*(oeEvent When &ane( i c(oed.
330
Popup Menu
!ane( ha bui(tBin u&&ort to di&(ay a +u((y cuto"i=ab(e &o&u& "enuE an icon to di&(ay the "enu
i &(aced at to&Bri,ht corner. 9hi +eature i enab(ed by de+inin, a "enu co"&onent and de+inin, it
a the o&tion +acet.
<p:panel closa-le'(true(>
<f:facet name'(options(>
<p:menu>
//5enuitems
</p:menu>
</f:facet>
</p:panel>
$ustom Action
I+ youd (i3e to add cuto" action to &ane( tit(ebarE ue action +acet 'ith icon "ar3u&K
<p:panel>
<f:facet name'(actions(>
<h:command7in2 stylelass'(ui3panel3title-ar3icon
ui3corner3all ui3state3default(>
<h:output!e&t stylelass'(ui3icon ui3icon3help( />
</h:command7in2>
</f:facet>
//content
</p:panel>
S+innin& Panel
!ane( reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the (it o+
)tyle #lass Applies
.uiB&ane( 8ain container e(e"ent o+ &ane(
.uiB&ane(Btit(ebar .eader container
.uiB&ane(Btit(e .eader te0t
.uiB&ane(Btit(ebarBicon 7&tion icon in header
.uiB&ane(Bcontent !ane( content
.uiB&ane(B+ooter !ane( +ooter
331
#.68 Panel)rid
!ane(Grid i an e0tenion to the tandard &ane(Grid co"&onent 'ith additiona( +eature uch a
the"in, and co(&anBro'&an.
In%o
9a, panel/rid
*o"&onent *(a org.primefaces.component.panelgrid.Panel/ridenderer
*o"&onent 9y&e org.primefaces.component.Panel/rid
Renderer 9y&e org.primefaces.component.Panel/ridenderer
Renderer *(a org.primefaces.component.panelgrid.Panel/ridenderer
Attributes
rendered.
co(u"n +a(e Inte,er <u"ber o+ co(u"n in ,rid.
332
ty(e nu(( Strin, In(ine ty(e o+ the &ane(.
ty(e*(a nu(( Strin, Sty(e c(a o+ the &ane(.
co(u"n*(ae nu(( Strin, *o""a e&arated (it o+ co(u"n ty(e c(ae.
)ettin& started with Panel)rid
1aic ua,e o+ &ane(Grid i a"e a the tandard one.
<p:panelIrid columns'(A(>
<h:output7a-el for'(firstname( value'(6irstname:( />
<p:input!e&t id'(firstname( value'(./-ean.firstname0( la-el'(6irstname( />
<h:output7a-el for'(surname( value'(8urname:( />
<p:input!e&t id'(surname( value'(./-ean.surname0( la-el'(8urname(/>
</p:panelIrid>
(eader and Footer
!ane(Grid &rovide +acet +or header and +ooter content.
<p:panelIrid columns'(A(>
=asic #anelIrid
</f:facet>

<p:input!e&t id'(firstname( value'(./-ean.firstname0( la-el'(6irstname( />
<p:input!e&t id'(surname( value'(./-ean.surname0( la-el'(8urname(/>

<p:command=utton type'(-utton( value'(8ave( icon'(ui3icon3chec2( />
</f:facet>
</p:panelIrid>
"owspan and $olspan
!ane(Grid u&&ort ro'&an and co(&an o&tion a 'e((E in thi cae ro' and co(u"n "ar3u&
hou(d be de+ined "anua((y.
333
<p:panelIrid>
<p:row>
<p:column rowspan'()(><<<</p:column>
<p:column colspan'(E(>===</p:column>
</p:row>
<p:row>
<p:column colspan'(A(></p:column>
<p:column colspan'(A(>DDD</p:column>
</p:row>
<p:row>
<p:column>$$$</p:column>
<p:column>666</p:column>
<p:column>III</p:column>
<p:column>444</p:column>
</p:row>
</p:panelIrid>
S+innin&
!ane(Grid reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB&ane(,rid 8ain container e(e"ent o+ &ane(Grid.
.uiB&ane(,ridBheader .eader.
.uiB&ane(,ridB+ooter #ooter.
.uiB&ane(,ridBeven Even nu"bered ro'.
.uiB&ane(,ridBodd 7dd nu"bered ro'.
334
#.7: PanelMenu
!ane(8enu i a hybrid co"&onent o+ accordion!ane( and tree co"&onent.
In%o
9a, panel!enu
*o"&onent *(a org.primefaces.component.panelmenu.Panel!enu
*o"&onent 9y&e org.primefaces.component.Panel!enu
Renderer 9y&e org.primefaces.component.Panel!enuenderer
Renderer *(a org.primefaces.component.panelmenu.Panel!enuenderer
Attributes
be rendered.
"ode( nu(( 8enu8ode( 8enu8ode( intance to bui(d "enu dyna"ica((y.
335
)ettin& started with PanelMenu
!ane(8enu conit o+ ub"enu and "enuite". #irt (eve( o+ ub"enu are rendered a accordion
&ane( and decendant ub"enu are rendered a tree node. Aut (i3e in any other "enu co"&onentE
"enuite" can be uti(i=ed to do a/a0 reCuetE nonBa/a0 reCuet and i"&(e GE9 navi,ation.
<p:panel5enu style'(width:A00p&(>
<p:su-menu la-el'(<,a& 5enuitems(>
<p:menuitem value'(8ave( action7istener'(./-utton=ean.save0( />
<p:menuitem value'(Kpdate( action7istener'(./-utton=ean.update0( />
</p:su-menu>
<p:su-menu la-el'(Jon3<,a& 5enuitem(>
<p:menuitem value'(Delete( action7istener'(./-utton=ean.delete0(
a,a&'(false(/>
</p:su-menu>
<p:su-menu la-el'(Javigations( >
<p:su-menu la-el'(7in2s( icon'(ui3icon3e&tlin2(>
<p:su-menu la-el'(#rime6aces( icon'(ui3icon3heart(>
<p:menuitem value'(4ome( url'(http://www.primefaces.org( />
<p:menuitem value'(Docs( url'(http://www.primefaces.org/...( />
<p:menuitem value'(8upport( url'(http://www.primefaces.org/...( />
</p:su-menu>
</p:su-menu>
<p:menuitem value'(5o-ile( outcome'(/mo-ile/inde&( />
</p:su-menu>
</p:panel5enu>
S+innin&
!ane(8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB&ane("enu 8ain container e(e"ent.
.uiB&ane("enuBheader .eader o+ a &ane(.
.uiB&ane("enuBcontent #ooter o+ a &ane(.
.uiB&ane("enu .uiB"enuB(it 9ree container.
.uiB&ane("enu .uiB"enuite" A "enuite" in tree.
336
#.71 Password
Password component is an extended version of standard inputSecret component with theme
integration and strength indicator.
In%o
9a, pass0ord
*o"&onent *(a org.primefaces.component.pass0ord.Pass0ord
*o"&onent 9y&e org.primefaces.component.Pass0ord
Renderer 9y&e org.primefaces.component.Pass0ordenderer
Renderer *(a org.primefaces.component.pass0ord.Pass0ordenderer
Attributes
QStrin,
reo(ved to a converter intance. In cae it a tatic te0tE it
"ut re+er to a converter id
reCuired +a(e boo(ean 8ar3 co"&onent a reCuired
337
E0&r
the in&ut.
E0&r
hand(in, a va(uechan,eevent
+ai(.
+eedbac3 +a(e 1oo(ean Enab(e tren,th indicator.
in(ine +a(e boo(ean Di&(ay +eedbac3 in(ine rather than uin, a &o&u&.
&ro"&t6abe( !(eae
enter a
&a'ord
Strin, 6abe( o+ &ro"&t.
(eve( 1 Inte,er 6eve( o+ ecurity.
'ea36abe( Wea3 Strin, 6abe( o+ 'ea3 &a'ord.
,ood6abe( Good Strin, 6abe( o+ ,ood &a'ord.
tron,6abe( Stron, Strin, 6abe( o+ tron, &a'ord.
redi&(ay +a(e 1oo(ean Whether or not to di&(ay &reviou va(ue.
"atch nu(( Strin, Id o+ another &a'ord co"&onent to "atch va(ue a,aint.
e(e"ent.
thi +ie(d.
+ocu.
338
+ocu and it va(ue ha been "odi+ied ince ,ainin, +ocu.
c(ic3ed.
doub(e c(ic3ed.
receive +ocu.
over in&ut e(e"ent.
by the uer.
in&ut e(e"ent.
339
)ettin& Started with Password
!a'ord i an in&ut co"&onent and ued /ut (i3e a tandard in&ut te0t. When feedbac" o&tion i
enab(ed a &a'ord tren,th indicator i di&(ayed.
<p:password value'(./-ean.password0( feed-ac2'(true[false( />
pu-lic class =ean /
private 8tring password;
pu-lic 8tring get#assword9: / return password; 0
pu-lic void set#assword98tring password: / this.password ' password;0
0
I170
A(thou,h a(( (abe( are in En,(ih by de+au(tE you can &rovide cuto" (abe( a 'e((. #o((o'in,
&a'ord ,ive +eedbac3 in 9ur3ih.
<p:password value'(./-ean.password0( prompt7a-el'(7"tfen #ifre giriniO(
wea27a-el'(Xay$f( good7a-el'(Orta seviye( strong7a-el'(I"%l"( feed-ac2' (true(/>
Inline Stren&th Indicator
1y de+au(t tren,th indicator i ho'n in an over(ayE i+ you &re+er an in(ine indicator /ut enab(e
in(ine "ode.
<p:password value'(./my-ean.password0( inline'(true( feed-ac2' (true(/>
$on%irmation
!a'ord con+ir"ation i a co""on cae and &a'ord &rovide an eay 'ay to i"&(e"ent. 9he
other &a'ord co"&onent id hou(d be ued to de+ine the match o&tion.
<p:password id'(pwd*( value'(./password=ean.passwordU0( feed-ac2'(false(
match'(pwdA( la-el'(#assword *( reBuired'(true(/>

<p:password id'(pwdA( value'(./password=ean.passwordU0( feed-ac2'(false(
la-el'(#assword A( reBuired'(true(/>
S+innin&
Structura( e(ector +or &a'ord areK
Name Applies
.uiB&a'ord In&ut e(e"ent.
.uiB&a'ordB&ane( 7ver(ay &ane( o+ tren,th indicator.
.uiB&a'ordB"eter Stren,th "eter.
340
Name Applies
.uiB&a'ordBin+o Stren,th (abe(.
341
#.72 Photo$am
!hoto*a" i ued to ta3e &hoto 'ith 'ebca" and end the" to the AS# bac3end "ode(.
In%o
9a, p"oto#am
*o"&onent *(a org.primefaces.component.p"otocam.P"oto#am
*o"&onent 9y&e org.primefaces.component.P"oto#am
Renderer 9y&e org.primefaces.component.P"oto#amenderer
Renderer *(a org.primefaces.component.p"otocam.P"oto#amenderer
Attributes
rendered +a(e 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE
Strin,
reCuired 0 boo(ean 8ar3 co"&onent a reCuired
E0&r
E0&r
+ai(.
342
&roce nu(( Strin, Identi+ier o+ co"&onent to &roce durin, ca&ture.
u&date nu(( Strin, Identi+ier o+ co"&onent to u&date durin, ca&ture.
(itener nu(( 8ethod
E0&r
8ethod e0&reion to (iten to ca&ture event.
)ettin& started with Photo$am
*a&ture i tri,,ered via c(ient ide a&i capture "ethod. A(o a "ethod e0&reion i neceary to
invo3e 'hen an i"a,e i ca&tured. Sa"&(e be(o' ca&ture an i"a,e and ave it to a directory.
<h:form>
<p:photoam widget@ar'(pc( listener'(./photoam=ean.oncapture0(update'(photos(/>

<p:command=utton type'(-utton( value'(apture( onclic2'(#69?pc?:.capture9:(/>
</h:form>
pu-lic class #hotoam=ean /

pu-lic void oncapture9apture$vent capture$vent: /
-yteQS data ' capture$vent.getData9:;

8tring new6ileJame ' servletonte&t.getCeal#ath9((: > 6ile.separator >
(photocam( > 6ile.separator > (captured.png(;
6ileImageOutput8tream imageOutput;
try /
imageOutput ' new 6ileImageOutput8tream9new 6ile9new6ileJame::;
imageOutput.write9dataH 0H data.length:;
imageOutput.close9:;
0
catch9$&ception e: /
throw new 6aces$&ception9($rror in writing captured image.(:;
0
0
0
0otes
G !hoto*a" i a +(ahE canva and /avacri&t o(ution.
G It i not u&&orted in IE at the "o"ent and thi 'i(( be 'or3ed on in +uture verion.
343
#.7# Pic+*ist
!ic36it i ued +or tran+errin, data bet'een t'o di++erent co((ection.
In%o
9a, pic,*ist
*o"&onent *(a org.primefaces.component.pic,list.Panel
*o"&onent 9y&e org.primefaces.component.Pic,*ist
Renderer 9y&e org.primefaces.component.Pic,*istenderer
Renderer *(a org.primefaces.component.pic,list.Pic,*istenderer
Attributes
rendered.
Strin,
E0&r
344
E0&r
va(idation +ai(.
var nu(( Strin, <a"e o+ the iterator.
ite"6abe( nu(( Strin, 6abe( o+ an ite".
ite">a(ue nu(( 7b/ect >a(ue o+ an ite".
ty(e nu(( Strin, Sty(e o+ the "ain container.
diab(ed +a(e 1oo(ean Diab(e the co"&onent.
e++ect nu(( Strin, <a"e o+ the ani"ation to di&(ay.
e++ectS&eed nu(( Strin, S&eed o+ the ani"ation.
add6abe( Add Strin, 9it(e o+ add button.
addA((6abe( Add A(( Strin, 9it(e o+ add a(( button.
re"ove6abe( Re"ove Strin, 9it(e o+ re"ove button.
re"oveA((6abe( Re"ove A(( Strin, 9it(e o+ re"ove a(( button.
"oveU&6abe( 8ove U& Strin, 9it(e o+ "ove u& button.
"ove9o&6abe( 8ove 9o& Strin, 9it(e o+ "ove to& button.
"oveDo'n6abe( 8ove Do'n Strin, 9it(e o+ "ove do'n button.
"ove1utto"6abe( 8ove
1utto"
Strin, 9it(e o+ "ove botto" button.
ho'Source*ontro( +a(e Strin, S&eci+ie viibi(ity o+ reorder button o+ ource (it.
ho'9ar,et*ontro( +a(e Strin, S&eci+ie viibi(ity o+ reorder button o+ tar,et (it.
on9ran+er nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen an ite" i
tran+erred +ro" one (it to another.
ite"Diab(ed +a(e 1oo(ean S&eci+ied i+ an ite" can be &ic3ed or not.
ho'Source#i(ter +a(e 1oo(ean Di&(ay and in&ut +i(ter +or ource (it.
345
ho'9ar,et#i(ter +a(e 1oo(ean Di&(ay and in&ut +i(ter +or tar,et (it.
+i(ter8atch8ode tartWith Strin, 8atch "ode +or +i(terin,E va(id va(ue are
tartWithE containE endWith and cuto".
+i(ter#unction nu(( Strin, <a"e o+ the /avacri&t +unction +or cuto" +i(terin,.
ho'*hec3bo0 +a(e 1oo(ean When trueE a chec3bo0 i di&(ayed ne0t to each
ite".
(abe(Di&(ay too(ti& Strin, De+ine ho' the button (abe( di&(ayedE va(id
va(ue are Itoo(ti&I ?de+au(t@ and Iin(ineI.
)ettin& started with Pic+*ist
Mou need to create cuto" "ode( ca((ed org.primefaces.model.'ual&ist-odel to ue !ic36it. A
the na"e u,,et it conit o+ t'o (itE one i the ource (it and the other i the tar,et. A the +irt
e0a"&(e 'e(( create a Dua(6it8ode( that contain baic Strin,.
pu-lic class #ic27ist=ean /
private Dual7ist5odel<8tring> cities;
pu-lic #ic27ist=ean9: /
7ist<8tring> source ' new <rray7ist<8tring>9:;
7ist<8tring> target ' new <rray7ist<8tring>9:;
cities8ource.add9(Istan-ul(:;
cities8ource.add9(<n2ara(:;
cities8ource.add9(IOmir(:;
cities8ource.add9(<ntalya(:;
cities8ource.add9(=ursa(:;
//more cities
cities ' new Dual7ist5odel<8tring>9cities8ourceH cities!arget:;
0
pu-lic Dual7ist5odel<8tring> getities9: /
return cities;
0
pu-lic void setities9Dual7ist5odel<8tring> cities: /
this.cities ' cities;
0
0
And bind the citie dua( (it to the &ic3(itK
<p:pic27ist value'(./pic27ist=ean.cities0( var'(city(
item7a-el'(./city0( item@alue'(./city0(>
346
When the enc(oed +or" i ub"ittedE the dua( (it re+erence i &o&u(ated 'ith the ne' va(ue and
you can acce thee va(ue 'ith Dua(6it8ode(.,etSource?@ and Dua(6it8ode(.,et9ar,et?@ a&i.
P;!;s
8ot o+ the ti"e you 'ou(d dea( 'ith co"&(e0 &o/o rather than i"&(e ty&e (i3e Strin,.
9hi ue cae i no di++erent e0ce&t the addition o+ a converter. #o((o'in, &ic36it di&(ay a (it o+
&(ayer?na"eE a,e ...@.
<p:pic27ist value'(./pic27ist=ean.players0( var'(player(
item7a-el'(./player.name0( item@alue'(./player0( converter'(player(>
!(ayer*onverter in thi cae hou(d i"&(e"ent #ava$.faces.convert.Converter contract and
i"&(e"ent ,etAStrin,E ,etA7b/ect "ethod. <ote that a converter i a('ay neceary +or
&ri"itive ty&e (i3e (on,E inte,erE boo(ean a 'e((.
In addition cuto" content intead o+ i"&(e trin, can be di&(ayed by uin, co(u"n.
<p:pic27ist value'(./pic27ist=ean.players0(
var'(player( iconOnly'(true( effect'(-ounce(
item@alue'(./player0( converter'(player(
show8ourceontrols'(true( show!argetontrols'(true(>
<p:column style'(width:A5F(>
<p:graphicImage value'(/images/-arca/./player.photo0(/>
</p:column>
<p:column style'(width:P5F(;>
./player.name0 3 ./player.num-er0
</p:column>
</p:pic27ist>
"eorderin&
!ic36it u&&ort reorderin, o+ ource and tar,et (itE thee are enab(ed by showSourceControls and
showTargetControls o&tion.
/%%ects
An ani"ation i di&(ayed 'hen tran+errin, 'hen ite" to another or reorderin, a (itE de+au(t e++ect
i +ade and +o((o'in, o&tion are avai(ab(e to be a&&(ied uin, effect attributeK b(indE bounceE c(i&E
dro&E e0&(odeE +o(dE hi,h(i,htE &u++E &u(ateE ca(eE ha3eE i=e and (ide. effectSpeed attribute i ued
to cuto"i=e the ani"ation &eedE va(id va(ue are slowE normal and fast.
$aptions
*a&tion te0t +or (it are de+ined 'ith +acet na"ed sourceCaption and targetCaptionK
item7a-el'(./city0( item@alue'(./city0( on!ransfer'(handle!ransfer9e:(>
<f:facet name'(sourceaption(><vaila-le</f:facet>
<f:facet name'(targetaption(>8elected</f:facet>
</p:pic27ist>
347
Filterin&
!ic36it &rovide bui(tBin c(ient ide +i(terin,. #i(terin, i enab(ed by ettin, the corre&ondin,
+i(terin, attribute o+ a (it. #or ource (it thi i showSourceFilter and +or tar,et (it it i
showTargetFilter. De+au(t "atch "ode i tartWith and containE endWith are a(o avai(ab(e
o&tion.
When you need to a cuto" "atch "ode et filter-atch-ode to cuto" and 'rite a /avacri&t
+unction that ta3e ite"6abe( and +i(ter>a(ue a &ara"eter. Return +a(e to hide an ite" and true to
di&(ay.
item7a-el'(./city0( item@alue'(./city0(
show8ource6ilter'(true( show!arget6ilter'(true(
filter5atch5ode'(custom( filter6unction'(myfilter(>
</p:pic27ist>
function myfilter9item7a-elH filter@alue: /
//return true or false
0
on1rans%er
I+ youd (i3e to e0ecute cuto" /avacri&t 'hen an ite" i tran+erredE bind your /avacri&t +unction
to onTransfer attribute.
item7a-el'(./city0( item@alue'(./city0( on!ransfer'(handle!ransfer9e:(>
function handle!ransfer9e: /
//item ' e.item
//from7ist ' e.from
//to7ist ' e.to7ist
//type ' e.type 9type of transfer; commandH d-lclic2 or dragdrop:
0
</script>
A,a- .ehaior /ents
!ic36it &rovide transfer a the de+au(t and on(y a/a0 behavior event that i +ired 'hen an ite" i
"oved +ro" one (it to the other. E0a"&(e be(o' de"ontrate ho' to ue thi event.
item7a-el'(./city0( item@alue'(./city0(>
<p:a,a& event'(transfer( listener'(./pic27ist=ean.handle!ransfer0( />
</p:pic27ist>
348
pu-lic class #ic27ist=ean /
//Dual7ist5odel code
pu-lic void handle!ransfer9!ransfer$vent event: /
//event.getItems9: : 7ist of items transferred
//event.is<dd9: : Is transfer from source to target
//event.isCemove9: : Is transfer from target to source
0
0
S+innin&
!ic36it reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the (it
)tyle #lass Applies
.uiB&ic3(it 8ain container e(e"ent?tab(e@ o+ &ic3(it
.uiB&ic3(itB(it 6it o+ a &ic3(it
.uiB&ic3(itB(itBource Source (it
.uiB&ic3(itB(itBtar,et 9ar,et (it
.uiB&ic3(itBourceBcontro( *ontainer e(e"ent o+ ource (it reorderin, contro(
.uiB&ic3(itBtar,etBcontro( *ontainer e(e"ent o+ tar,et (it reorderin, contro(
.uiB&ic3(itBbutton 1utton o+ a &ic3(it
.uiB&ic3(itBbuttonB"oveBu& 8ove u& button
.uiB&ic3(itBbuttonB"oveBto& 8ove to& button
.uiB&ic3(itBbuttonB"oveBdo'n 8ove do'n button
.uiB&ic3(itBbuttonB"oveBbotto" 8ove botto" button
.uiB&ic3(itBbuttonBadd Add button
.uiB&ic3(itBbuttonBaddBa(( Add a(( button
.uiB&ic3(itBbuttonBre"oveBa(( Re"ove a(( button
.uiB&ic3(itBbuttonBadd Add button
349
#.7' Poll
!o(( i an a/a0 co"&onent that ha the abi(ity to end &eriodica( a/a0 reCuet.
In%o
9a, poll
*o"&onent *(a org.primefaces.component.poll.Poll
*o"&onent 9y&e org.primefaces.component.Poll
Renderer 9y&e org.primefaces.component.Pollenderer
Renderer *(a org.primefaces.component.poll.Pollenderer
Attributes
interva( % Inte,er Interva( in econd to do &eriodic a/a0 reCuet.
(itener nu(( 8ethodE0&r A "ethod e0&reion to invo3e by &o((in,.
&roce nu(( Strin, *o"&onent id?@ to &roce &artia((y intead o+ 'ho(e
vie'.
ontart nu(( Strin, Aavacri&t hand(er to e0ecute be+ore a/a0 reCuet i be,in.
co"&(eted.
onucce nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet ucceed.
350
a/a0Statu.
autoStart true 1oo(ean In autoStart "odeE &o((in, tart auto"atica((y on &a,e
(oadE to tart &o((in, on de"and et to +a(e.
to& +a(e 1oo(ean Sto& &o((in, 'hen true.
)ettin& started with Poll
!o(( be(o' invo3e incre"ent "ethod on *ounter1ean every % econd and t$t>count i u&dated
'ith the ne' va(ue o+ the count variab(e. <ote that &o(( "ut be neted inide a +or".
<h:output!e&t id'(t&tLcount( value'(./counter=ean.count0( />

<p:poll listener'(./counter=ean.increment0( update'(t&tLcount( />
pu-lic class ounter=ean /
private int count;
count>>;
0
pu-lic int getount9: /
return this.count;
0
pu-lic void setount9int count: /
this.count ' count;
0
0
351
1unin& timin&
1y de+au(t the &eriodic interva( i % econdE thi i chan,ed 'ith the interva( attribute. #o((o'in,
&o(( 'or3 every 5 econd.

<p:poll listener'(./counter=ean.increment0( update'(t&tLcount( interval'(5( />
Start and Stop
!o(( can be tarted and to&&ed uin, c(ient ide a&iK
<h:form>
<p:poll interval'(5( action7istener'(./counter=ean.increment0(
update'(t&tLcount( widget@ar'(my#oll( auto8tart'(false( />
<a href'(.( onclic2'(#69?my#oll?:.start9:;(>8tart</a>
<a href'(.( onclic2'(#69?my#oll?:.stop9:;(>8top</a>
</h:form>
7r bind a boo(ean variab(e to the stop attribute and et it to +a(e at any arbitrary ti"e.
352
#.73 Printer
!rinter a((o' endin, a &eci+ic AS# co"&onent to the &rinterE not the 'ho(e &a,e.
In%o
9a, printer
1ehavior *(a org.primefaces.component.&e"avior.Printer
Attributes
rendered.
tar,et nu(( Strin, 9ar,et co"&onent to &rint.
)ettin& started with the Printer
!rinter i attached to any co""and co"&onent (i3e a button or a (in3. E0a"&(e be(o'
de"ontrate ho' to &rint a i"&(e out&ut te0t or a &articu(ar i"a,e on &a,eK
<h:command=utton id'(-tn( value'(#rint(>
<p:printer target'(output( />
</h:command=utton>
<h:output!e&t id'(output( value'(#rime6aces Coc2s!( />
<p:printer target'(image( />
<h:output!e&t value'(#rint Image( />
</h:output7in2>
<p:graphicImage id'(image( value'(/images/nature*.,pg( />
353
#.75 Pro&ress.ar
!ro,re1ar i a &roce tatu indicator that can either 'or3 &ure(y on c(ient ide or interact 'ith
erver ide uin, a/a0.
In%o
9a, propress%ar
*o"&onent *(a org.primefaces.component.progress&ar.Progress%ar
*o"&onent 9y&e org.primefaces.component.Progress&ar
Renderer 9y&e org.primefaces.component.Progress%arenderer
Renderer *(a org.primefaces.component.progress&ar.Progress%arenderer
Attributes
rendered.
va(ue 0 Inte,er >a(ue o+ the &ro,re bar
diab(ed +a(e 1oo(ean Diab(e or enab(e the &ro,rebar
a/a0 +a(e 1oo(ean S&eci+ie the "ode o+ &ro,re1arE in a/a0 "ode
&ro,re va(ue i retrieved +ro" a bac3in, bean.
interva( )000 Inte,er Interva( in econd to do &eriodic reCuet in a/a0
"ode.
354
(abe(9e"&(ate Vva(ueW Strin, 9e"&(ate o+ the &ro,re (abe(.
di&(ay7n(y +a(e 1oo(ean Enab(e tatic di&(ay "ode.
a/a0Statu.
)ettin& started with the Pro&ress.ar
!ro,re1ar ha t'o "odeE Ic(ientI?de+au(t@ or Ia/a0I. #o((o'in, i a &ure c(ient ide &ro,re1ar.
<p:progress=ar widget@ar'(p-( />
<p:command=utton value'(8tart( type'(-utton( onclic2'(start9:( />
<p:command=utton value'(ancel( type'(-utton( onclic2'(cancel9:( />
function start9: /
this.progressInterval ' setInterval9function9:/
#69?p-?:.set@alue9#69?p-?:.get@alue9: > *0:;
0H A000:;
0
function cancel9: /
clearInterval9this.progressInterval:;
#69?p-?:.set@alue90:;
0
</script>
A,a- Pro&ress
A/a0 "ode i enab(ed by ettin, a/a0 attribute to trueE in thi cae the va(ue de+ined on a "ana,ed
bean i retrieved &eriodica((y and ued to u&date the &ro,re.
<p:progress=ar a,a&'(true( value'(./progress=ean.progress0( />
pu-lic class #rogress=ean /
private int progress;
//getter3setter
0
355
Interal
!ro,re1ar i baed on &o((in, and )000 "i((iecond i the de+au(t interva( +or a/a0 &ro,re bar
"eanin, every ) econd &ro,re va(ue 'i(( be reca(cu(ated. In order to et a di++erent va(ueE ue
the interva( attribute.
<p:progress=ar interval'(5000( />
A,a- .ehaior /ents
!ro,re1ar &rovide complete a the de+au(t and on(y a/a0 behavior event that i +ired 'hen the
&ro,re i co"&(eted. E0a"&(e be(o' de"ontrate ho' to ue thi event.
pu-lic class #rogress=ean /
private int progress;
pu-lic void handleomplete9: /
//<dd a faces message
0
pu-lic int get#rogress9: /
return progress;
0
pu-lic void set#rogress9int progress: /
this.progress ' progress;
0
0
<p:progress=ar value'(./progress=ean.progress0( a,a&'(true(>
<p:a,a& event'(complete( listener'(./progress=ean.handleomplete0(
update'(messages( />
</p:progress=ar>
Display ;nly
Au"e you have a &roce (i3e a tic3et &urchae that &an variou &a,e 'here each &a,e ha
di++erent ue cae uch a cuto"er in+oE eat e(ectionE bi((in,E &ay"ent and "ore. In order to
di&(ay tatic va(ue o+ the &roce on each &a,eE you can ue a tatic &ro,re1ar.
<p:progress=ar value'(50( displayOnly'(true( />
$lient Side API
Wid,etN PrimeFaces.widget.Progress)ar
,et>a(ue?@ B <u"ber Return current va(ue
356
et>a(ue?va(ue@ va(ueN >a(ue to di&(ay void Set current va(ue
tart?@ B void Start a/a0 &ro,re bar
cance(?@ B void Sto& a/a0 &ro,re bar
S+innin&
!ro,re1ar reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB&ro,rebar 8ain container.
.uiB&ro,rebarBva(ue >a(ue o+ the &ro,rebar
.uiB&ro,rebarB(abe( !ro,re (abe(.
357
#.76 "adio.utton
Radio1utton i a he(&er co"&onent o+ Se(ect7neRadio to i"&(e"ent cuto" (ayout.
In%o
9a, radio%utton
*o"&onent *(a org.primefaces.component.radio&utton.adio%utton
*o"&onent 9y&e org.primefaces.component.adio%utton
Renderer 9y&e org.primefaces.component.adio%uttonenderer
Renderer *(a org.primefaces.component.radio&utton.adio%uttonenderer
Attributes
rendered.
diab(ed +a(e 1oo(ean Diab(ed the co"&onent.
ite"Inde0 nu(( Inte,er Inde0 o+ the e(ectIte" o+ e(ect7neRadio.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute on tate chan,e.
+or nu(( Strin, Id o+ the e(ect7neRadio to attach to.
ty(e*(a nu(( Strin, Sty(e c(a o+ the container.
tabinde0 nu(( Strin, S&eci+ie the tab order o+ e(e"ent in tab navi,ation.
)ettin& started with "adio.utton
See cuto" (ayout &art in Se(ect7neRadio ection +or "ore in+or"ation.
358
#.77 "atin&
Ratin, co"&onent +eature a tar baed ratin, yte".
In%o
9a, rating
*o"&onent *(a org.primefaces.component.rating.ating
*o"&onent 9y&e org.primefaces.component.ating
Renderer 9y&e org.primefaces.component.atingenderer
Renderer *(a org.primefaces.component.rating.atingenderer
Attributes
be rendered.
Strin,
i""ediate 0 1oo(ean 1oo(ean va(ue that &eci+ie the (i+ecyc(e &hae
the va(ue*han,eEvent hou(d be &roceedE
'hen true the event 'i(( be +ired at Ia&&(y reCuet
va(ueIE i+ i""ediate i et to +a(eE va(ue*han,e
Event are +ired in I&roce va(idationI
&hae
359
va(idator nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a
"ethod va(idation, the in&ut
va(ue*han,e6itener nu(( 8ethodE0&r A "ethod bindin, e0&reion that re+er to a
"ethod +or hand(in, a va(uchan,eevent
va(idation +ai(.
tar 5 Inte,er <u"ber o+ tar to di&(ay
diab(ed +a(e 1oo(ean Diab(e uer interaction
readon(y +a(e 1oo(ean Diab(e uer interaction 'ithout diab(ed viua(.
onRate nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen rate ha&&en.
cance( true 1oo(ean When enab(edE di&(ay a cance( icon to reet.
)ettin& Started with "atin&
Ratin, i an in&ut co"&onent that ta3e a doub(e variab(e a it va(ue.
pu-lic class Cating=ean /
private Integer rating;
//getter3setter
0
<p:rating value'(./rating=ean.rating0( />
0umber o% Stars
De+au(t nu"ber o+ tar i 5E i+ you need (e or "ore tar ue the tar attribute. #o((o'in, ratin,
conit o+ 10 tar.
<p:rating value'(./rating=ean.rating0( stars'(*0(/>
360
Display <alue ;nly
In cae 'here you on(y 'ant to ue the ratin, co"&onent to di&(ay the ratin, va(ue and dia((o'
uer interactionE et readonly to true. Uin, disabled attribute doe the a"e but add diab(ed
viua( ty(e.
A,a- .ehaior /ents
Ratin, &rovide rate and cancel a a/a0 behavior event. A de+ined (itener +or rate event 'i(( be
e0ecuted by &ain, an org.primefaces.event.+ateEvent a a &ara"eter and cance( event 'i(( be
invo3ed 'ith no &ara"eter.
<p:rating value'(./rating=ean.rating0(>
<p:a,a& event'(rate( listener'(./rating=ean.handleCate0( update'(msgs( />
<p:a,a& event'(cancel( listener'(./rating=ean.handleancel0( update'(msgs( />
</p:rating>
<p:messages id'(msgs( />
pu-lic class Cating=ean /
private Integer rating;
pu-lic void handleCate9Cate$vent rate$vent: /
Integer rate ' 9Integer: rate$vent.getCating9:;
//<dd facesmessage
0
pu-lic void handleancel9: /
//<dd facesmessage
0
//getter3setter
0
on+ate i ca((ed 'hen a tar i e(ected 'ith value a the on(y &ara"eter.
<p:rating value'(./rating=ean.rating0( onCate'(alert9?"ou rated: ? > value:( />
$lient Side API
Wid,etN PrimeFaces.widget.+ating
,et>a(ue?@ B <u"ber Return the current va(ue
et>a(ue?va(ue@ va(ueN >a(ue to et void U&date ratin, va(ue 'ith &rovided one.
diab(e?@ B void Diab(e co"&onent.
enab(e?@ B void Enab(e co"&onent.
361
reet?@ B void *(ear the ratin,.
S+innin&
Ratin, reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the (it
)tyle #lass Applies
.uiBratin, 8ain container e(e"ent.
.uiBratin,Bcance( *ance( icon
.uiBratin, De+au(t tar
.uiBratin,Bon Active tar
362
#.78 "emote$ommand
Re"ote*o""and &rovide a 'ay to e0ecute bac3in, bean "ethod direct(y +ro" /avacri&t.
In%o
9a, remote#ommand
*o"&onent *(a org.primefaces.component.remotecommand.emote#ommand
*o"&onent 9y&e org.primefaces.component.emote#ommand
Renderer 9y&e org.primefaces.component.emote#ommandenderer
Renderer *(a org.primefaces.component.remotecommand.emote#ommandenderer
Attributes
action nu(( 8ethod
E0&r
A "ethod e0&reion thatd be &roceed in the &artia(
reCuet caued by uia/a0.
action6itener nu(( 8ethod
E0&r
An action(itener thatd be &roceed in the &artia( reCuet
caued by uia/a0.
na"e nu(( Strin, <a"e o+ the co""and
u&date nu(( Strin, *o"&onent?@ to u&date 'ith a/a0.
ontart nu(( Strin, Aavacri&t hand(er to e0ecute be+ore a/a0 reCuet i be,in.
co"&(eted.
onucce nu(( Strin, Aavacri&t hand(er to e0ecute 'hen a/a0 reCuet ucceed.
363
,(oba( true 1oo(ean G(oba( a/a0 reCuet are (itened by a/a0Statu co"&onentE
ettin, ,(oba( to +a(e 'i(( not tri,,er a/a0Statu.
autoRun +a(e 1oo(ean When enab(ed co""and i e0ecuted on &a,e (oad.
)ettin& started with "emote$ommand
Re"ote*o""and i ued by invo3in, the co""and +ro" your /avacri&t code.
<p:remoteommand name'(increment( action7istener'(./counter.increment0(
out'(count( />
<h:output!e&t id'(count( value'(./counter.count0( />
function customfunction9: /
//your custom code
increment9:; //ma2es a remote call
0
</script>
9hat it 'henever you e0ecute your cuto" /avacri&t +unction?e, cuto"+unction?@@E a re"ote ca((
'i(( be "adeE action6itener i &roceed and out&ut te0t i u&dated. <ote that re"ote*o""and
"ut be neted inide a +or".
Passin& Parameters
Re"ote co""and can end dyna"ic &ara"eter in the +o((o'in, 'ayK
increment9Q/name:?&?H value:*00H /name:?y?H value:A00S:;
364
#.8: "esetInput
In&ut co"&onent 3ee& their (oca( va(ue at tate 'hen va(idation +ai(. ReetIn&ut i ued to c(ear
the cached va(ue +ro" tate o that co"&onent retrieve their va(ue +ro" the bac3in, bean "ode(
intead.
In%o
9a, reset.nput
Action6itener *(a org.primefaces.component.resetinput.eset.nputAction*istener
Attributes
tar,et nu(( Strin, *o""a or 'hite &ace e&arated (it o+
co"&onent identi+ier.
)ettin& started with "esetInput
ReetIn&ut i attached to action ource co"&onent (i3e co""and1utton and co""and6in3.
<h:form id'(form(>
<p:panel id'(panel( header'(Jew Kser( style'(margin3-ottom:*0p&;(>
<p:messages id'(messages( />
<p:input!e&t id'(firstname( value'(./ppr=ean.firstname0(
reBuired'(true( la-el'(6irstname(>
<f:validate7ength minimum'(A( />
</p:input!e&t>
<p:input!e&t id'(surname( value'(./ppr=ean.surname0(
reBuired'(true( la-el'(8urname(/>
</h:panelIrid>
</p:panel>
<p:command=utton value'(8u-mit( update'(panel(
action7istener'(./ppr=ean.save#erson0( />
<p:command=utton value'(Ceset !ag( update'(panel( process'(Zthis(>
<p:resetInput target'(panel( />
</p:command=utton>
<p:command=utton value'(Ceset Jon3<,a&(
action7istener'(./ppr=ean.reset0( immediate'(true( a,a&'(false(>
<p:resetInput target'(panel( />
</p:command=utton>
</h:form>
ReetIn&ut u&&ort both a/a0 and nonBa/a0 actionE +or nonBa/a0 action et i""ediate true on the
ource co"&onent o (i+ecyc(e /u"& to render re&one a+ter reettin,. 9o reet "u(ti&(e
365
co"&onent at onceE &rovide a (it o+ id or /ut &rovide an ancetor co"&onent (i3e the &ane( in
a"&(e above.
"eset Pro&rammatically
ReetIn&ut ta, i the dec(arative 'ay to reet in&ut co"&onentE another 'ay i reettin,
&ro,ra""atica((y. 9hi i a(o handy i+ in&ut hou(d ,et reet baed on a condition. #o((o'in,
a"&(e de"ontrate ho' to ue ReCuet*onte0t to do the reet 'ithin an a/a0behavior (itener.
!ara"eter o+ the reet "ethod can be a in,(e c(ientId or a co((ection o+ c(ientId.
<p:input!e&t value'(./-ean.value0(>
<p:a,a& event'(-lur( listener'(./-ean.listener0( />
</p:input!e&t>
pu-lic void listener9: /
CeBuestonte&t conte&t ' CeBuestonte&t.geturrentInstance9:;
conte&t.reset9(form:panel(:;
0
1ip
&Na/a0 ha bui(tBin reset2alues attribute to reet va(ue o+ &roceed co"&onent durin, a reCuet.
366
#.81 "esi9able
Rei=ab(e co"&onent i ued to "a3e another AS# co"&onent rei=ab(e.
In%o
9a, resi3a&le
*o"&onent *(a org.primefaces.component.resi3a&le.esi3a&le
*o"&onent 9y&e org.primefaces.component.esi3a&le
Renderer 9y&e org.primefaces.component.esi3a&leenderer
Renderer *(a org.primefaces.component.resi3a&le.esi3a&leenderer
Attributes
+or nu(( Strin, Identi+ier o+ the tar,et co"&onent to "a3e rei=ab(e.
a&ectRatio +a(e 1oo(ean De+ine i+ a&ectRatio hou(d be 3e&t or not.
&ro0y +a(e 1oo(ean Di&(ay &ro0y e(e"ent intead o+ actua( e(e"ent.
hand(e nu(( Strin, S&eci+ie the rei=e hand(e.
,hot +a(e 1oo(ean In ,hot "odeE rei=e he(&er i di&(ayed a the ori,ina(
e(e"ent 'ith (e o&acity.
ani"ate +a(e 1oo(ean Enab(e ani"ation.
e++ect 'in, Strin, E++ect to ue in ani"ation.
e++ectDuration nor"a( Strin, E++ect duration o+ ani"ation.
"a0Width nu(( Inte,er 8a0i"u" 'idth boundary in &i0e(.
"a0.ei,ht nu(( Inte,er 8a0i"u" hei,ht boundary in &i0e(.
"inWidth 10 Inte,er 8ini"u" 'idth boundary in &i0e(.
"in.ei,ht 10 Inte,er 8a0i"u" hei,ht boundary in &i0e(.
367
contain"ent +a(e 1oo(ean Set rei=ab(e boundarie a the &arent i=e.
,rid 1 Inte,er Sna& rei=in, to ,rid tructure.
onStart nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen rei=in, be,in.
onRei=e nu(( Strin, *(ient ide ca((bac3 to e0ecute durin, rei=in,.
onSto& nu(( Strin, *(ient ide ca((bac3 to e0ecute a+ter rei=in, end.
)ettin& started with "esi9able
Rei=ab(e i ued by ettin, for o&tion a the identi+ier o+ the tar,et.
<p:graphicImage id'(img( value'(campnou.,pg( />
<p:resiOa-le for'(img( />
Another e0a"&(e i the in&ut +ie(dE i+ uer need "ore &ace +or a te0tareaE "a3e it rei=ab(e byK
<h:input!e&tarea id'(area( value'(CesiOe me if you need more space( />
<p:resiOa-le for'(area( />
.oundaries
9o &revent over(a&&in, 'ith other e(e"ent on &a,eE boundarie need to be &eci+ied. 9herere -
attribute +or thi min5idthE ma$5idthE min.eight and ma$.eight. 9he va(id va(ue +or thee
attribute are nu"ber in ter" o+ &i0e(.
<p:resiOa-le for'(area( min1idth'(A0( min4eight'(E0( ma&1idth'(50( ma&4eight'(*00(/>
(andles
Rei=e hand(e to di&(ay are cuto"i=e uin, handles attribute 'ith a co"bination o+ nE eE sE wE neE
seE sw and nw a the va(ue. De+au(t va(ue i IeE sE seI.
<p:resiOa-le for'(area( handles'(eHwHnHseHswHneHnw(/>
<isual Feedbac+
Rei=e he(&er i the e(e"ent ued to &rovide viua( +eedbac3 durin, rei=in,. 1y de+au(t actua(
e(e"ent ite(+ i the he(&er and t'o o&tion are avai(ab(e to cuto"i=e the 'ay +eedbac3 i &rovided.
Enab(in, ghost o&tion di&(ay the e(e"ent ite(+ 'ith a (o'er o&acityE in addition enab(in, pro$y
o&tion add a c c(a ca((ed .ui1resi/able1pro$y 'hich you can override to cuto"i=e.
368
<p:resiOa-le for'(area( pro&y'(true( />
.ui3resiOa-le3pro&y /
-order: Ap& dotted .006;
0
/%%ects
Rei=in, can be ani"ated uin, animate o&tion and ettin, an effect na"e. Ani"ation &eed i
cuto"i=ed uin, effect'uration o&tion 4slow4E 4normal4 and 4fast4 a va(id va(ue.
<p:resiOa-le for'(area( animate'(true( effect'(swing( effectDuration'(normal( />
#o((o'in, i the (it o+ avai(ab(e e++ect na"eK
G 'in,
G eaeInDuad
G eae7utDuad
G eaeIn7utDuad
G eaeIn*ubic
G eae7ut*ubic
G eaeIn7ut*ubic
G eaeInDuart
G eae7utDuart
G eaeIn7utDuart
G eaeInDuint
G eae7utDuint
G eaeIn7utDuint
G eaeInSine
G eae7utSine
G eaeInE0&o
G eae7utE0&o
G eaeIn7utE0&o
G eaeIn*irc
G eae7ut*irc
G eaeIn7ut*irc
G eaeInE(atic
G eae7utE(atic
G eaeIn7utE(atic
G eaeIn1ac3
G eae7ut1ac3
G eaeIn7ut1ac3
G eaeIn1ounce
G eae7ut1ounce
G eaeIn7ut1ounce
A,a- .ehaior /ents
Rei=ab(e &rovide de+au(t and on(y resi/e event that i ca((ed on rei=e end. In cae you have a
(itener de+inedE it 'i(( be ca((ed by &ain, an org.primefaces.event.+esi/eEvent intance a a
&ara"eter.
<p:resiOa-le for'(area(>
<p:a,a& listener'(./resiOe=ean.handleCesiOe0(>
</p:resiOa-le>
pu-lic class CesiOe=ean /
pu-lic void handleCesiOe9CesiOe$vent event: /
int width ' event.get1idth9:;
int height ' event.get4eight9:;
0
0
369
Rei=ab(e ha three c(ient ide ca((bac3 you can ue to hoo3Bin your /avacri&tK onStartE on+esi/e
and onStop. A(( o+ thee ca((bac3 receive t'o &ara"eter that &rovide variou in+or"ation about
rei=e event.
<p:resiOa-le for'(area( on8top'(handle8top9eventH ui:( />
function handle8top9eventH ui: /
//ui.helper ' helper element as a ,Duery o-,ect
//ui.original#osition ' topH left position -efore resiOing
//ui.original8iOe ' widthH height -efore resiOing
//ui.positon ' topH left after resiOing
//ui.siOe ' width height of current siOe
0
S+innin&
)tyle #lass Applies
.uiBrei=ab(e E(e"ent that i rei=ab(e
.uiBrei=ab(eBhand(e .and(e e(e"ent
.uiBrei=ab(eBhand(eBVhand(e3eyW !articu(ar hand(e e(e"ent identi+ied by hand(e3ey (i3e eE E ne
.uiBrei=ab(eB&ro0y !ro0y he(&er e(e"ent +or viua( +eedbac3
370
#.82 "in&
Rin, i a data di&(ay co"&onent 'ith a circu(ar ani"ation.
In%o
9a, ring
*o"&onent *(a org.primefaces.component.ring.ing
*o"&onent 9y&e org.primefaces.component.ing
Renderer 9y&e org.primefaces.component.ingenderer
Renderer *(a org.primefaces.component.ring.ingenderer
Attributes
be rendered.
va(ue nu(( 7b/ect *o((ection to di&(ay.
var nu(( Strin, <a"e o+ the data iterator.
eain, 'in, Strin, 9y&e o+ eain, to ue in ani"ation.
371
)ettin& started with "in&
A co((ection i reCuired to ue the Rin, co"&onent.
pu-lic class Cing=ean /
pu-lic Cing=ean9: /

players.add9new #layer9(5essi(H *0H (messi.,pg(H (6(::;
players.add9new #layer9(Iniesta(H GH (iniesta.,pg(H (5(::;
players.add9new #layer9(@illa(H PH (villa.,pg(H (6(::;
players.add9new #layer9(Navi(H UH (&avi.,pg(H (5(::;
players.add9new #layer9(#uyol(H 5H (puyol.,pg(H (=(::;
0
//getterRsetter for players
0
<p:ring value'(./ring=ean.players0( var'(player]>
<p:graphicImage value'(/images/-arca/./player.photo0(/>
</p:ring>
Item Selection
A co(u"n i reCuired to &roce ite" e(ection +ro" rin, &ro&er(y.
<p:ring value'(./ring=ean.players0( var'(player(>
<p:column>
//KI to select an item e.g. command7in2
</p:column>
</p:ring>
/asin&
#o((o'in, i the (it o+ avai(ab(e o&tion +or eain, ani"ation.
G 'in,
G eaeInDuad
G eae7utDuad
G eaeIn7utDuad
G eaeIn*ubic
G eae7ut*ubic
G eaeIn7ut*ubic
G eaeInDuart
G eae7utDuart
G eaeIn7utDuart
G eaeInDuint
G eae7utDuint
G eaeIn7utDuint
G eaeInSine
G eae7utSine
G eaeInE0&o
G eae7utE0&o
G eaeIn7utE0&o
G eaeIn*irc
G eae7ut*irc
G eaeIn7ut*irc
G eaeInE(atic
G eae7utE(atic
G eaeIn7utE(atic
G eaeIn1ac3
G eae7ut1ac3
G eaeIn7ut1ac3
G eaeIn1ounce
G eae7ut1ounce
G eaeIn7ut1ounce
372
S+innin&
Rin, reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the (it o+
tructura( ty(e c(ae.
)tyle #lass Applies
.uiBrin, 8ain container e(e"ent.
.uiBrin,Bite" Each ite" in the (it.
373
#.8# "ow
Ro' i a he(&er co"&onent +or datatab(e.
In%o
9a, ro0
*o"&onent *(a org.primefaces.component.ro0.o0
*o"&onent 9y&e org.primefaces.component.o0
Attributes
be rendered.
)ettin& Started with "ow
See datatab(e ,rou&in, ection +or "ore in+or"ation about ho' ro' i ued.
374
#.8' "ow/ditor
Ro'Editor i a he(&er co"&onent +or datatab(e.
In%o
9a, ro0'ditor
*o"&onent *(a org.primefaces.component.ro0editor.o0'ditor
*o"&onent 9y&e org.primefaces.component.o0'ditor
Renderer 9y&e org.primefaces.component.o0'ditorenderer
Renderer *(a org.primefaces.component.ro0editor.o0'ditorenderer
Attributes
be rendered.
)ettin& Started with "ow/ditor
See in(ine editin, ection in datatab(e docu"entation +or "ore in+or"ation about ua,e.
375
#.83 "ow/-pansion
Ro'E0&anion i a he(&er co"&onent o+ datatab(e ued to i"&(e"ent e0&andab(e ro'.
In%o
9a, ro0'$pansion
*o"&onent *(a org.primefaces.component.ro0e$pansion.o0'$pansion
*o"&onent 9y&e org.primefaces.component.o0'$pansion
Attributes
be rendered.
)ettin& Started with "ow/-pansion
See datatab(e e0&andab(e ro' ection +or "ore in+or"ation about ho' ro'E0&anion i ued.
376
#.85 "ow1o&&ler
Ro'9o,,(er i a he(&er co"&onent +or datatab(e.
In%o
9a, ro0Toggler
*o"&onent *(a org.primefaces.component.ro0toggler.o0Toggler
*o"&onent 9y&e org.primefaces.component.o0Toggler
Renderer 9y&e org.primefaces.component.o0Togglerenderer
Renderer *(a org.primefaces.component.ro0toggler.o0Togglerenderer
Attributes
be rendered.
)ettin& Started with "ow
See e0&andab(e ro' ection in datatab(e docu"entation +or "ore in+or"ation about ua,e.
377
#.86 Schedule
Schedu(e &rovide an 7ut(oo3 *a(endarE i*a( (i3e AS# co"&onent to "ana,e event.
In%o
9a, sc"edule
*o"&onent *(a org.primefaces.component.sc"edule.)c"edule
*o"&onent 9y&e org.primefaces.component.)c"edule
Renderer 9y&e org.primefaces.component.)c"eduleenderer
Renderer *(a org.primefaces.component.sc"edule.)c"eduleenderer
Attributes
not be rendered.
378
va(ue nu(( 7b/ect An or,.&ri"e+ace."ode(.Schedu(e8ode(
intance re&reentin, the bac3ed "ode(
(oca(e nu(( 7b/ect 6oca(e +or (oca(i=ationE can be Strin, or a
/ava.uti(.6oca(e intance
a&ectRatio nu(( #(oat Ratio o+ ca(endar 'idth to hei,htE hi,her the
va(ue horter the hei,ht i
vie' "onth Strin, 9he vie' ty&e to ueE &oib(e va(ue are
O"onthOE Oa,endaDayOE Oa,endaWee3OE
ObaicWee3OE ObaicDayO
initia(Date nu(( 7b/ect 9he initia( date that i ued 'hen chedu(e
(oad. I+ o""ittedE the chedu(e tart on the
current date
ho'Wee3end true 1oo(ean S&eci+ie inc(uion SaturdayQSunday
co(u"n in any o+ the vie'
ty(e nu(( Strin, Sty(e o+ the "ain container e(e"ent o+
chedu(e
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container e(e"ent o+
chedu(e
dra,,ab(e true 1oo(ean When trueE event are dra,,ab(e.
rei=ab(e true 1oo(ean When trueE event are rei=ab(e.
ho'.eader true 1oo(ean S&eci+ie viibi(ity o+ header content.
(e+t.eader9e"&(ate &revE ne0t
today
Strin, *ontent o+ (e+t ide o+ header.
center.eader9e"&(ate tit(e Strin, *ontent o+ center o+ header.
ri,ht.eader9e"&(ate "onthE
a,endaWee3E
a,endaDay
Strin, *ontent o+ ri,ht ide o+ header.
a((DayS(ot true 1oo(ean Deter"ine i+ a((Bday (ot 'i(( be di&(ayed
in a,endaWee3 or a,endaDay vie'
(ot8inute )0 Inte,er Interva( in "inute in an hour to create a (ot.
+irt.our 4 Inte,er #irt hour to di&(ay in day vie'.
"in9i"e nu(( Strin, 8ini"u" ti"e to di&(ay in a day vie'.
"a09i"e nu(( Strin, 8a0i"u" ti"e to di&(ay in a day vie'.
a0i#or"at nu(( Strin, Deter"ine the ti"eBte0t that 'i(( be
di&(ayed on the vertica( a0i o+ the a,enda
vie'.
379
ti"e#or"at nu(( Strin, Deter"ine the ti"eBte0t that 'i(( be
di&(ayed on each event.
co(u"n#or"at nu(( Strin, #or"at +or co(u"n header.
ti"eUone nu(( 7b/ect Strin, or a /ava.uti(.9i"eUone intance to
&eci+y the ti"e=one ued +or date
converion.
i,nore9i"e=one true 1oo(ean When &arin, dateE 'hether U9* o++et
hou(d be i,nored 'hi(e &rocein, event
data.
too(ti& +a(e 1oo(ean Di&(ay decri&tion o+ event on a too(ti&.
)ettin& started with Schedule
Schedu(e need to be bac3ed by an org.primefaces.model.Schedule-odel intanceE a chedu(e
"ode( conit o+ org.primefaces.model.ScheduleEvent intance.
<p:schedule value'(./schedule=ean.model0( />
pu-lic class 8chedule=ean /
private 8chedule5odel model;
pu-lic 8chedule=ean9: /
event5odel ' new 8chedule5odel<8chedule$vent>9:;
event5odel.add$vent9new Default8chedule$vent9(title(H new Date9:H
new Date9:::;
0
pu-lic 8chedule5odel get5odel9: /
return model;
0
0
De+au(tSchedu(eEvent i the de+au(t i"&(e"entation o+ Schedu(eEvent inter+ace. 8andatory
&ro&ertie reCuired to create a ne' event are the tit(eE tart date and end date. 7ther &ro&ertie uch
a a((Day ,et enib(e de+au(t va(ue.
9ab(e be(o' decribe each &ro&erty in detai(.
Property Description
id Ued interna((y by !ri"e#aceE auto ,enerated.
tit(e 9it(e o+ the event.
tartDate Start date o+ ty&e /ava.uti(.Date.
380
Property Description
endDate End date o+ ty&e /ava.uti(.Date.
a((Day #(a, indicatin, event i a(( day.
ty(e*(a >iua( ty(e c(a to enab(e "u(ti reource di&(ay.
data 7&tiona( data you can et to be re&reented by Event.
editab(e Whether the event i editab(e or not.
decri&tion 9oo(ti& te0t to di&(ay on "oueover o+ an event.
A,a- .ehaior /ents
Schedu(e &rovide variou a/a0 behavior event to re&ond uer action.
dateSe(ect or,.&ri"e+ace.event.Se(ectEvent When a date i e(ected.
eventSe(ect or,.&ri"e+ace.event.Se(ectEvent When an event i e(ected.
event8ove or,.&ri"e+ace.event.Schedu(eEntry8oveEvent When an event i "oved.
eventRei=e or,.&ri"e+ace.event.Schedu(eEntryRei=eEvent When an event i rei=ed.
vie'*han,e or,.&ri"e+ace.event.Se(ectEvent When a vie' i chan,ed.
A,a- 4pdates
Schedu(e ha a Cuite co"&(e0 UI 'hich i ,enerated onBtheB+(y by the c(ient ide
!ri"e#ace.'id,et.Schedu(e 'id,et to ave band'idth and increae &a,e (oad &er+or"ance. A a
reu(t 'hen you try to u&date chedu(e (i3e 'ith a re,u(ar !ri"e#ace !!RE you "ay notice a UI
(a, a the D78 'i(( be re,enerated and re&(aced. InteadE Schedu(e &rovide a i"&(e c(ient ide
a&i and the update "ethod.
Whenever you ca(( u&dateE chedu(e 'i(( Cuery it erver ide Schedu(e8ode( intance to chec3 +or
u&dateE tran&ort "ethod ued to (oad event dyna"ica((y i AS7<E a a reu(t thi a&&roach i
"uch "ore e++ective then u&datin, 'ith re,u(ar !!R. An e0a"&(e o+ thi i de"ontrated at editab(e
chedu(e e0a"&(eE ave button i ca((in, !#?Owidgetvar?!.update! at onco"&(ete event hand(er.
1imeBone
1y de+au(tE ti"e=one o++et are i,nored. Set i,nore9i"e=one to +a(e o that chedu(e ta3e care o+
ti"e=one di++erence by ca(cu(atin, the c(ient bro'er ti"e=one and the event date o that event
are di&(ayed at the c(ient (oca( ti"e.
/ditable Schedule
6et &ut it a(to,ether to co"e u& a +u((y editab(e and co"&(e0 chedu(e.
381
<h:form>
<p:schedule value'(./-ean.event5odel0( edita-le'(true( widget@ar'(myschedule(>
<p:a,a& event'(date8elect( listener'(./-ean.onDate8elect0(
update'(eventDetails( oncomplete'(eventDialog.show9:( />
<p:a,a& event'(event8elect( listener'(./-ean.on$vent8elect0(
</p:schedule>
<p:dialog widget@ar'(eventDialog( header'($vent Details(>
<h:panelIrid id'(eventDetails( columns'(A(>
<h:output7a-el for'(title( value'(!itle:( />
<h:input!e&t id'(title( value'(./-ean.event.title0( reBuired'(true(/>
<h:output7a-el for'(from( value'(6rom:( />
<p:input5as2 id'(from( value'(./-ean.event.startDate0( mas2'(++/++/++++(>
<f:convertDate!ime pattern'(dd/55/yyyy( />
</p:input5as2>
<h:output7a-el for'(to( value'(!o:( />
<p:input5as2 id'(to( value'(./-ean.event.endDate0( mas2'(++/++/++++(>
<f:convertDate!ime pattern'(dd/55/yyyy( />
</p:input5as2>
<h:output7a-el for'(allDay( value'(<ll Day:( />
<h:select=ooleanhec2-o& id'(allDay( value'(./-ean.event.allDay0( />
<p:command=utton type'(reset( value'(Ceset( />
<p:command=utton value'(8ave( action7istener'(./-ean.add$vent0(
oncomplete'(#69?myschedule?:.update9:;#69?eventDialog?:.hide9:;(/>
</h:panelIrid>
</p:dialog>
</h:form>
382
private 8chedule5odel<8chedule$vent> model;
private 8chedule$ventImpl event ' new Default8chedule$vent9:;
event5odel ' new 8chedule5odel<8chedule$vent>9:;
0
pu-lic 8chedule5odel<8chedule$vent> get5odel9: / return model; 0
pu-lic 8chedule$ventImpl get$vent9: / return event; 0
pu-lic void set$vent98chedule$ventImpl event: / this.event ' event; 0
pu-lic void add$vent9: /
if9event.getId9: '' null:
event5odel.add$vent9event:;
else
event5odel.update$vent9event:;
event ' new Default8chedule$vent9:; //reset dialog form
0
pu-lic void on$vent8elect98elect$vent e: /
event ' 98chedule$vent: e.getO-,ect9:;
0
pu-lic void onDate8elect98elect$vent e: /
Date date ' 9Date: e.getO-,ect9:;
event ' new Default8chedule$vent9((H dateH date:;
0
0
*a9y *oadin&
Schedu(e au"e 'ho(e et o+ event are ea,er(y &rovided in Schedu(e8ode(E i+ you have a hu,e
data et o+ eventE (a=y (oadin, +eature 'ou(d he(& to i"&rove &er+or"ance. In (a=y (oadin, "odeE
on(y the event that be(on, to the di&(ayed ti"e +ra"e are +etched 'herea in de+au(t ea,er "ore
a(( event need to be (oaded.
<p:schedule value'(./schedule=ean.laOy5odel0( />
9o enab(e (a=y (oadin, o+ Schedu(e eventE you /ut need to &rovide an intance o+
org.primefaces.model.&a/ySchedule-odel and i"&(e"ent the loadEvents "ethod. loadEvents
"ethod i ca((ed 'ith ne' boundarie every ti"e di&(ayed ti"e+ra"e i chan,ed.
383
private 8chedule5odel laOy5odel;
laOy5odel ' new 7aOy8chedule5odel9: /
ZOverride
pu-lic void load$vents9Date startH Date end: /
//add$vent9...:;
//add$vent9...:;
0
0;
0
pu-lic 8chedule5odel get7aOy5odel9: /
return laOy5odel;
0
0
$ustomi9in& (eader
.eader contro( o+ Schedu(e can be cuto"i=ed baed on te"&(ateE va(id va(ue o+ te"&(ate o&tion
areK
G tit(eN 9e0t o+ current "onthQ'ee3Qday in+or"ation
G &revN 1utton to "ove ca(endar bac3 one "onthQ'ee3Qday.
G ne0tN 1utton to "ove ca(endar +or'ard one "onthQ'ee3Qday.
G &revMearN 1utton to "ove ca(endar bac3 one year
G ne0tMearN 1utton to "ove ca(endar +or'ard one year
G todayN 1utton to "ove ca(endar to current "onthQ'ee3Qday.
view=ame
N 1utton to chan,e the vie' ty&e baed on the vie' ty&e.
9hee contro( can be &(aced at three (ocation on header 'hich are de+ined 'ith
left.eaderTemplateE right.eaderTemplate and centerTemplate attribute.
<p:schedule value'(./schedule=ean.model0(
left4eader!emplate(today(
right4eader!emplate'(prevHne&t(
center!emplate'(monthH agenda1ee2H agendaDay(
</p:schedule>
384
<iews
5 di++erent vie' are u&&ortedE thee are I"onthIE Ia,endaWee3IE Ia,endaDayIE IbaicWee3I and
IbaicDayI.
a,endaWee3
<p:schedule value'(./schedule=ean.model0( view'(agenda1ee2(/>
a,endaDay
<p:schedule value'(./schedule=ean.model0( view'(agendaDay(/>
baicWee3
<p:schedule value'(./schedule=ean.model0( view'(-asic1ee2(/>
385
baicDay
<p:schedule value'(./schedule=ean.model0( view'(-asicDay(/>
*ocale Support
1y de+au(t (oca(e in+or"ation i retrieved +ro" the vie' (oca(e and can be overridden by the (oca(e
attribute. 6oca(e attribute can ta3e a (oca(e 3ey a a Strin, or a /ava.uti(.6oca(e intance. De+au(t
(an,ua,e o+ (abe( are En,(ih and you need to add the neceary tran(ation to your &a,e "anua((y
a !ri"e#ace doe not inc(ude (an,ua,e tran(ation. !ri"e#ace Wi3i !a,e +or
!ri"e#ace6oca(e i a co""unity driven &a,e 'here you "ay +ind the tran(ation you need.
!(eae contribute to thi 'i3i 'ith your o'n tran(ation.
http://wi2i.primefaces.org/display/omponents/#rime6aces>7ocales
9ran(ation i a i"&(e /avacri&t ob/ectE 'e u,,et addin, the code to a /avacri&t +i(e and inc(ude
in your a&&(ication. #o((o'in, i a 9ur3ih ca(endar.
<p:schedule value'(./schedule=ean.model0( locale'(tr(/>
S+innin&
Schedu(e reide in a "ain container 'hich style and styleClass attribute a&&(y. A 3innin, ty(e
c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation.
386
#.87 ScrollPanel
Scro((!ane( i ued to di&(ay cro((ab(e content 'ith the"e a'are cro((bar intead o+ native
bro'er cro((bar.
In%o
9a, scrollPanel
*o"&onent *(a org.primefaces.component.scrollpanel.)crollPanel
*o"&onent 9y&e org.primefaces.component.)crollPanel
Renderer 9y&e org.primefaces.component.)crollPanelenderer
Renderer *(a org.primefaces.component.scrollpanel.)crollPanelenderer
Attributes
be rendered.
"ode de+au(t Strin, Scro((bar di&(ay "odeE va(id va(ue are de+au(t
and native.
387
)ettin& started with ScrollPanel
In order to ,et cro((ab(e contentE 'idth andQor hei,ht hou(d be de+ined.
<p:scroll#anel style'(width:A50p&;height:A00p&(>
//any content
</p:scroll#anel>
0atie Scroll.ars
1y de+au(tE cro((!ane( di&(ay the"e a'are cro((barE ettin, "ode o&tion to native di&(ay
bro'er cro((bar.
<p:scroll#anel style'(width:A50p&;height:A00p&( mode'(native(>
//any content
</p:scroll#anel>
S+innin&
Scro((!ane( reide in a "ain container 'hich style and styleClass attribute a&&(y. A 3innin, ty(e
)tyle #lass Applies
.uiBcro((&ane( 8ain container e(e"ent.
.uiBcro((&ane(Bcontainer 7ver+(o' container.
.uiBcro((&ane(Bcontent *ontent e(e"ent.
.uiBcro((&ane(Bhbar .ori=onta( cro((bar container.
.uiBcro((&ane(Bvbar >ertica( cro((bar container.
.uiBcro((&ane(Btrac3 9rac3 e(e"ent.
.uiBcro((barBdra, Dra, e(e"ent.
388
#.88 Select.oolean.utton
Se(ect1oo(ean1utton i ued to e(ect a binary deciion 'ith a to,,(e button.
In%o
9a, select%oolean%utton
*o"&onent *(a org.primefaces.component.select&oolean&utton.)elect%oolean%utton
*o"&onent 9y&e org.primefaces.component.)elect%oolean%utton
Renderer 9y&e org.primefaces.component.)elect%oolean%uttonenderer
Renderer *(a org.primefaces.component.select&oolean&utton.)elect%oolean%uttonenderer
Attributes
Strin,
E0&r
the in&ut
E0&r
A "ethod e0&reion that re+er to a "ethod +or hand(in,
a va(uechan,eevent
+ai(.
389
(abe( nu(( Strin, Uer &reentab(e na"e.
onchan,e nu(( Strin, *a((bac3 to e0ecute on va(ue chan,e.
on6abe( nu(( Strin, 6abe( to di&(ay 'hen button i e(ected.
o++6abe( nu(( Strin, 6abe( to di&(ay 'hen button i une(ected.
onIcon nu(( Strin, Icon to di&(ay 'hen button i e(ected.
o++Icon nu(( Strin, Icon to di&(ay 'hen button i une(ected.
)ettin& started with Select.oolean.utton
Se(ect1oo(ean1utton ua,e i i"i(ar to e(ect1oo(ean*hec3bo0.
<p:select=oolean=utton id'(valueA( value'(./-ean.value0( on7a-el'("es(
off7a-el'(Jo( onIcon'(ui3icon3chec2( offIcon'(ui3icon3close( />
pu-lic class =ean /
private -oolean value;
//getter and setter
0
S+innin&
Se(ect1oo(ean1utton reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBe(ectboo(eanbutton 8ain container e(e"ent.
390
#.1:: Select.oolean$hec+bo-
Se(ect1oo(ean*hec3bo0 i an e0tended verion o+ the tandard chec3bo0 'ith the"e inte,ration.
In%o
9a, select%oolean#"ec,&o$
*o"&onent *(a org.primefaces.component.select&ooleanc"ec,&o$.)elect%oolean#"ec,&o$
*o"&onent 9y&e org.primefaces.component.)elect%oolean#"ec,&o$
Renderer 9y&e org.primefaces.component.)elect%oolean#"ec,&o$enderer
Renderer *(a org.primefaces.component.select&ooleanc"ec,&o$.)elect%oolean#"ec,&o$
enderer
Attributes
rendered.
Strin,
e0&reionE it reo(ved to a converter intance. In cae
it a tatic te0tE it "ut re+er to a converter id
+ai(.
391
ite"6abe( nu(( Strin, 6abe( di&(ayed ne0t to chec3bo0.
tabinde0 nu(( Strin, S&eci+ie tab order +or tab 3ey navi,ation.
)ettin& started with Select.oolean$hec+bo-
Se(ect1oo(ean*hec3bo0 ua,e i a"e a the tandard one.
$lient Side API
Wid,etN PrimeFaces.widget.Select)ooleanChec"bo$
chec3?@ B void *hec3 the chec3bo0.
unchec3?@ B void Unchec3 the chec3bo0.
to,,(e?@ B void 9o,,(e chec3 tate.
S+innin&
Se(ect1oo(ean*hec3bo0 reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBch3bo0 8ain container e(e"ent.
.uiBch3bo0Bbo0 *ontainer o+ chec3bo0 icon.
.uiBch3bo0Bicon *hec3bo0 icon.
.uiBch3bo0Bicon *hec3bo0 (abe(.
392
#.1:1 Select$hec+bo-Menu
Se(ect*hec3bo08enu i a "u(ti e(ect co"&onent that di&(ay o&tion in an over(ay.
In%o
9a, select#"ec,&o$!enu
*o"&onent *(a org.primefaces.component.selectc"ec,&o$menu.)elect#"ec,&o$!enu
*o"&onent 9y&e org.primefaces.component.)elect#"ec,&o$!enu
Renderer 9y&e org.primefaces.component.)elect#"ec,&o$!enuenderer
Renderer *(a org.primefaces.component.selectc"ec,&o$menu.)elect#"ec,&o$!enuenderer
Attributes
rendered.
Strin,
393
va(idation +ai(.
cro((.ei,ht nu(( Inte,er .ei,ht o+ the over(ay.
onSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen over(ay i
di&(ayed.
on.ide nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen over(ay i
hidden.
+i(ter +a(e 1oo(ean Render an in&ut +ie(d a a +i(ter.
+i(ter8atch8ode tartWith Strin, 8atch "ode +or +i(terin,E va(id va(ue are
tartWithE containE endWith and cuto".
+i(ter#unction nu(( Strin, *(ient ide +unction to ue in cuto" +i(terin,.
caeSenitive +a(e 1oo(ean De+ine i+ +i(terin, 'ou(d be cae enitive.
&ane(Sty(e nu(( Strin, In(ine ty(e o+ the over(ay.
&ane(Sty(e*(a nu(( Strin, Sty(e c(a o+ the over(ay.
a&&end9o nu(( Strin, A&&end the over(ay to the e(e"ent de+ined by
earch e0&reion. De+au(t to docu"ent body.
tabinde0 nu(( Strin, !oition o+ the e(e"ent in the tabbin, order.
394
)ettin& started with Select$hec+bo-Menu
Se(ect*hec3bo08enu ua,e i a"e a the tandard e(ect8any*hec3bo0 or !ri"e#ace
e(ect8any*hec3bo0 co"&onent.
<p:selecthec2-o&5enu value'(./-ean.selectedOptions0( la-el'(5ovies(>
<f:selectItems value'(./-ean.options0( />
Filterin&
When +i(terin, i enab(ed 'ith ettin, filter onE an in&ut +ie(d i rendered at over(ay header and on
3eyu& event +i(terin, i e0ecuted on c(ient ide uin, filter-atch-ode. De+au(t "ode o+
+i(ter8atch8ode are tartWithE containE endWith and cuto". *uto" "ode reCuire a /avacri&t
+unction to do the +i(terin,.
<p:selecthec2-o&5enu value'(./-ean.selectedOptions0( la-el'(5ovies(
filter5atch5ode'(custom( filter6unction'(custom6ilter(>
function custom6ilter9item7a-elH filter@alue: /
//return true to accept and false to re,ect
0
A,a- .ehaior /ents
In addition to co""on do" event (i3e chan,eE e(ect*hec3bo08enu &rovide toggleSelect event.
to,,(eSe(ect or,.&ri"e+ace.event.9o,,(eSe(ectEvent When to,,(e a(( chec3bo0 chan,e.
S+innin&
Se(ect*hec3bo08enu reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBe(ectchec3bo0"enu 8ain container e(e"ent.
.uiBe(ectchec3bo0"enuB(abe(Bcontainer 6abe( container.
.uiBe(ectchec3bo0"enuB(abe( 6abe(.
.uiBe(ectchec3bo0"enuBtri,,er Dro&do'n icon.
.uiBe(ectchec3bo0"enuB&ane( 7ver(ay &ane(.
.uiBe(ectchec3bo0"enuBite" 7&tion (it container.
395
)tyle #lass Applies
.uiBe(ectchec3bo0"enuBite" Each o&tion in the co((ection.
.uiBch3bo0 *ontainer o+ a chec3bo0.
396
#.1:2 SelectMany.utton
Se(ect8any1utton i a "u(ti e(ect co"&onent uin, button UI.
In%o
9a, select!any%utton
*o"&onent *(a org.primefaces.component.selectmany&utton.)elect!any%utton
*o"&onent 9y&e org.primefaces.component.)elect!any%utton
Renderer 9y&e org.primefaces.component.)elect!any%utton
Renderer *(a org.primefaces.component.selectmany&utton.)elect!any%utton
Attributes
rendered.
Strin,
va(idation +ai(.
397
)ettin& started with SelectMany.utton
Se(ect8any1utton ua,e i a"e a e(ect8any*hec3bo0E button /ut re&(ace chec3bo0e.
S+innin&
Se(ect8any1utton reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBe(ect"anybutton 8ain container e(e"ent.
398
#.1:# SelectMany$hec+bo-
Se(ect8any*hec3bo0 i an e0tended verion o+ the tandard Se(ect8any*hec3bo0 'ith the"e
inte,ration.
In%o
9a, select!any#"ec,&o$
*o"&onent *(a org.primefaces.component.selectmanyc"ec,&o$.)elect!any#"ec,&o$
*o"&onent 9y&e org.primefaces.component.)elect!any#"ec,&o$
Renderer 9y&e org.primefaces.component.)elect!any#"ec,&o$enderer
Renderer *(a org.primefaces.component.selectmanyc"ec,&o$.)elect!any#"ec,&o$enderer
Attributes
be rendered.
converter nu(( *onverterQSt
rin,
co"&onent.
399
va(idation +ai(.
(ayout (ineDirection Strin, 6ayout o+ the chec3bo0eE va(id va(ue are
line'irectionE page'irection and grid.
co(u"n 0 Inte,er <u"ber o+ co(u"n in ,rid (ayout.
)ettin& started with SelectMany$hec+bo-
Se(ect8any*hec3bo0 ua,e i a"e a the tandard one.
S+innin&
Se(ect8any*hec3bo0 reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBe(ect"anychec3bo0 8ain container e(e"ent.
.uiBch3bo0 *ontainer o+ a chec3bo0.
400
#.1:' SelectManyMenu
Se(ect8any8enu i an e0tended verion o+ the tandard Se(ect8any8enu.
In%o
9a, select!any!enu
*o"&onent *(a org.primefaces.component.selectmanymenu.)elect!any!enu
*o"&onent 9y&e org.primefaces.component.)elect!any!enu
Renderer 9y&e org.primefaces.component.)elect!any!enuenderer
Renderer *(a org.primefaces.component.selectmanymenu.)elect!any!enuenderer
Attributes
be rendered.
Strin,
401
va(idation +ai(.
onc(ic3 nu(( Strin, *a((bac3 +or c(ic3 event.
ondb(c(ic3 nu(( Strin, *a((bac3 +or db(c(ic3 event.
tabinde0 nu(( Strin, !oition o+ the in&ut e(e"ent in the tabbin, order.
var nu(( Strin, <a"e o+ iterator to be ued in cuto" content
di&(ay.
ho'*hec3bo0 +a(e 1oo(ean When trueE a chec3bo0 i di&(ayed ne0t to each
ite".
+i(ter +a(e 1oo(ean Di&(ay an in&ut +i(ter +or the (it.
+i(ter8atch8ode nu(( Strin, 8atch "ode +or +i(terin,E va(id va(ue are
tartWith ?de+au(t@E containE endWith and
cuto".
+i(ter#unction nu(( Strin, *(ient ide +unction to ue in cuto"
+i(ter8atch8ode.
cro((.ei,ht nu(( Inte,er De+ine the hei,ht o+ the cro((ab(e area
)ettin& started with SelectManyMenu
Se(ect8any8enu ua,e i a"e a the tandard one.
$ustom $ontent
*uto" content can be di&(ayed +or each ite" uin, co(u"n co"&onent.
402
<p:select5any5enu value'(./-ean.selected#layers0( converter'(player( var'(p(>
<f:selectItems value'(./-ean.players0( var'(player(
item7a-el'(./player.name0( item@alue'(./player0( />
<p:column>
<p:graphicImage value'(/images/-arca/./p.photo0( width'(E0(/>
</p:column>
<p:column>
</p:column>
</p:select5any5enu>
Filterin&
#i(terin, i enab(ed by ettin, +i(ter attribute to true. 9here are +our +i(ter "odeK starts5ithE
containsE ends5ith and custom. In cuto" "odeE filterFunction "ut be de+ined a the na"e o+ the
/avacri&t +unction that ta3e the ite" va(ue and +i(ter a &ara"eter to return a boo(ean to acce&t or
re/ect a va(ue. 9o add a +i(ter to &reviou e0a"&(eK
<p:selectOne5enu value'(./menu=ean.selected#layer0( converter'(player( var'(p(
filter'(true( filter5atch5ode'(contains(>
...
</p:selectOne5enu>
$hec+bo-
Se(ect8any8enu ha bui(tBin u&&ort +or chec3bo0 baed "u(ti&(e e(ectionE 'hen enab(ed by
showChec"bo$ o&tionE chec3bo0e are di&(ayed ne0t to each co(u"n.
403
S+innin&
Se(ect8any8enu reide in a container that style and styleClass attribute a&&(y. A 3innin, ty(e
)tyle #lass Applies
.uiBe(ect"any"enu 8ain container e(e"ent.
.uiBe(ect(itbo0Bite" Each ite" in (it.
404
#.1:3 Select;ne.utton
Se(ect7ne1utton i an in&ut co"&onent to do a in,(e e(ect.
In%o
9a, select6ne%utton
*o"&onent *(a org.primefaces.component.selectone&utton.)elect6ne%utton
*o"&onent 9y&e org.primefaces.component.)elect6ne%utton
Renderer 9y&e org.primefaces.component.)elect6ne%uttonenderer
Renderer *(a org.primefaces.component.selectone&utton.)elect6ne%uttonenderer
Attributes
be rendered.
converter nu(( *onverterQSt
rin,
co"&onent.
405
va(idation +ai(.
)ettin& started with Select;ne.utton
Se(ect7ne1utton ua,e i a"e a e(ect7neRadio co"&onentE button /ut re&(ace the radio.
S+innin&
Se(ect7ne1utton reide in a "ain container 'hich style and styleClass attribute a&&(y. A
)tyle #lass Applies
.uiBe(ectonebutton 8ain container e(e"ent.
406
#.1:5 Select;ne*istbo-
Se(ect7ne6itbo0 i an e0tended verion o+ the tandard e(ect7ne6itbo0 co"&onent.
In%o
9a, select6ne*ist&o$
*o"&onent *(a org.primefaces.component.selectonelist&o$.)elect6ne*ist&o$
*o"&onent 9y&e org.primefaces.component.)elect6ne*ist&o$
Renderer 9y&e org.primefaces.component.)elect6ne*ist&o$enderer
Renderer *(a org.primefaces.component.selectonelist&o$.)elect6ne*ist%o$enderer
Attributes
be rendered.
Strin,
co"&onent.
407
va(idation +ai(.
onc(ic3 nu(( Strin, *a((bac3 +or c(ic3 event.
ondb(c(ic3 nu(( Strin, *a((bac3 +or db(c(ic3 event.
tabinde0 nu(( Strin, !oition o+ the in&ut e(e"ent in the tabbin, order.
va(ue nu(( Strin, <a"e o+ iterator to be ued in cuto" content
di&(ay.
var nu(( Strin, <a"e o+ iterator to be ued in cuto" content
di&(ay.
+i(ter +a(e 1oo(ean Di&(ay an in&ut +i(ter +or the (it.
+i(ter8atch8ode nu(( Strin, 8atch "ode +or +i(terin,E va(id va(ue are
tartWith ?de+au(t@E containE endWith and
cuto".
+i(ter#unction nu(( Strin, *(ient ide +unction to ue in cuto"
+i(ter8atch8ode.
cro((.ei,ht nu(( Inte,er De+ine the hei,ht o+ the cro((ab(e area.
)ettin& started with Select;ne*istbo-
Se(ect7ne6itbo0 ua,e i a"e a the tandard one.
$ustom $ontent
*uto" content can be di&(ayed +or each ite" uin, co(u"n co"&onent.
408
<p:selectOne7ist-o& value'(./-ean.player0( converter'(player( var'(p(>
<f:selectItems value'(./-ean.players0( var'(player(
item7a-el'(./player.name0( item@alue'(./player0( />

<p:column>
<p:graphicImage value'(/images/-arca/./p.photo0( width'(E0(/>
</p:column>
<p:column>
</p:column>
</p:selectOne7ist-o&>
Filterin&
#i(terin, i enab(ed by ettin, +i(ter attribute to true. 9here are +our +i(ter "odeK starts5ithE
containsE ends5ith and custom. In cuto" "odeE filterFunction "ut be de+ined a the na"e o+ the
/avacri&t +unction that ta3e the ite" va(ue and +i(ter a &ara"eter to return a boo(ean to acce&t or
re/ect a va(ue. 9o add a +i(ter to &reviou e0a"&(eK
<p:selectOne5enu value'(./menu=ean.selected#layer0( converter'(player( var'(p(
filter'(true( filter5atch5ode'(contains(>
...
</p:selectOne5enu>
S+innin&
Se(ect7ne6itbo0 reide in a "ain container 'hich style and styleClass attribute a&&(y. A
409
)tyle #lass Applies
.uiBe(ectone(itbo0 8ain container e(e"ent.
.uiBe(ect(itbo0Bite" Each ite" in (it.
410
#.1:6 Select;neMenu
Se(ect7ne8enu i an e0tended verion o+ the tandard Se(ect7ne8enu.
In%o
9a, select6ne!enu
*o"&onent *(a org.primefaces.component.selectonemenu.)elect6ne!enu
*o"&onent 9y&e org.primefaces.component.)elect6ne!enu
Renderer 9y&e org.primefaces.component.)elect6ne!enuenderer
Renderer *(a org.primefaces.component.selectonemenu.)elect6ne!enuenderer
Attributes
rendered.
Strin,
411
va(idation +ai(.
e++ect b(ind Strin, <a"e o+ the to,,(e ani"ation.
e++ectS&eed -00 Inte,er Duration o+ to,,(e ani"ation in "i((iecond.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute on va(ue chan,e.
on3eyu& nu(( Strin, *(ient ide ca((bac3 to e0ecute on 3eyu&.
on3eydo'n nu(( Strin, *(ient ide ca((bac3 to e0ecute on 3eydo'n.
var nu(( Strin, <a"e o+ the ite" iterator.
hei,ht auto Inte,er .ei,ht o+ the over(ay.
tabinde0 nu(( Strin, 9abinde0 o+ the in&ut.
editab(e +a(e 1oo(ean When trueE in&ut beco"e editab(e.
+i(ter +a(e 1oo(ean Render an in&ut +ie(d a a +i(ter.
+i(ter8atch8ode tart
With
Strin, 8atch "ode +or +i(terin,E va(id va(ue are tartWithE
containE endWith and cuto".
+i(ter#unction nu(( Strin, *(ient ide +unction to ue in cuto" +i(terin,.
"a0(en,th nu(( Inte,er <u"ber o+ "a0i"u" character a((o'ed in editab(e
e(ect7ne8enu.
)ettin& started with Select;neMenu
1aic Se(ect7ne8enu ua,e i a"e a the tandard one.
412
$ustom $ontent
Se(ect7ne8enu can di&(ay cuto" content in over(ay &ane( by uin, co(u"n co"&onent and the
var o&tion to re+er to each ite".
pu-lic class 5enu=ean /
private #layer selected#layer;
players.add9new #layer9(5essi(H *0H (messi.,pg(::;
//more players
0
0
<p:selectOne5enu value'(./menu=ean.selected#layer0( converter'(player( var'(p(>
<f:selectItem item7a-el'(8elect One( item@alue'(( />
<f:selectItems value'(./menu=ean.players0( var'(player(
item7a-el'(./player.name0( item@alue'(./player0(/>
<p:column>
<p:graphicImage value'(/images/-arca/./p.photo0( width'(E0( height'(50(/>
</p:column>
<p:column>
</p:column>
</p:selectOne5enu>
/%%ects
An ani"ation i e0ecuted to ho' and hide the over(ay "enuE de+au(t e++ect i +ade and +o((o'in,
o&tion are avai(ab(e +or effect attributeK b(indE bounceE c(i&E dro&E e0&(odeE +o(dE hi,h(i,htE &u++E
&u(ateE ca(eE ha3eE i=eE (ide and none.
413
/ditable
Editab(e Se(ect7ne8enu &rovide a UI to either chooe +ro" the &rede+ined o&tion or enter a
"anua( in&ut. Set editab(e o&tion to true to ue thi +eature.
Filterin&
When +i(terin, i enab(ed 'ith ettin, filter onE an in&ut +ie(d i rendered at over(ay header and on
3eyu& event +i(terin, i e0ecuted on c(ient ide uin, filter-atch-ode. De+au(t "ode o+
+i(ter8atch8ode are tartWithE containE endWith and cuto". *uto" "ode reCuire a /avacri&t
+unction to do the +i(terin,.
<p:selectOne5enu value'(./-ean.selectedOptions0(
filter5atch5ode'(custom( filter6unction'(custom6ilter(>
</p:selectOne5enu>
function custom6ilter9item7a-elH filter@alue: /
//return true to accept and false to re,ect
0
$lient Side API
Wid,etN PrimeFaces.widget.Select,ne-enu
414
ho'?@ B void Sho' over(ay "enu.
hide?@ B void .ide over(ay "enu.
b(ur?@ B void Invo3e b(ur event.
+ocu?@ B void Invo3e +ocu event.
enab(e?@ B void Enab(e co"&onent.
diab(e?@ B void Diab(ed co"&onent.
e(ect>a(ue?@ va(ueN ite">a(ue void Se(ect ,iven va(ue.
,etSe(ected>a(ue?@ B 7b/ect Return va(ue o+ e(ected ite".
,etSe(ected6abe(?@ Strin, Return (abe( o+ e(ected ite".
S+innin&
Se(ect7ne8enu reide in a container e(e"ent that style and styleClass attribute a&&(y. A 3innin,
)tyle #lass Applies
.uiBe(ectone"enu 8ain container.
.uiBe(ectone"enuB(abe( 6abe( o+ the co"&onent.
.uiBe(ectone"enuBtri,,er *ontainer o+ dro&do'n icon.
.uiBe(ectone"enuBite" Ite" (it.
.uiBe(ectone"enuBite" Each ite" in the (it.
415
#.1:7 Select;ne"adio
Se(ect7neRadio i an e0tended verion o+ the tandard Se(ect7neRadio 'ith the"e inte,ration.
In%o
9a, select6neadio
*o"&onent *(a org.primefaces.component.selectoneradio.)elect6neadio
*o"&onent 9y&e org.primefaces.component.)elect6neadio
Renderer 9y&e org.primefaces.component.)elect6neadioenderer
Renderer *(a org.primefaces.component.selectoneradio.)elect6neadioenderer
Attributes
rendered.
Strin,
va(idation +ai(.
416
(ayout (ine
Direction
Strin, 6ayout o+ the radiobuttonE va(id va(ue are
line'irectionE page'irectionE custom and grid.
co(u"n 0 Inte,er <u"ber o+ co(u"n in ,rid (ayout.
tabinde0 nu(( Strin, S&eci+ie the tab order o+ e(e"ent in tab navi,ation.
&(ain +a(e 1oo(ean !(ain "ode di&(ay radiobutton uin, native
bro'er renderin, intead o+ the"e.
)ettin& started with Select;ne"adio
Se(ect7neRadio ua,e i a"e a the tandard one.
$ustom *ayout
Standard e(ect7neRadio co"&onent on(y u&&ort hori=onta( and vertica( renderin, o+ the radio
button 'ith a trict tab(e "ar3u&. !ri"e#ace Se(ect7neRadio on the other hand &rovide a
+(e0ib(e (ayout o&tion o that radio button can be (ocated any'here on the &a,e. 9hi i
i"&(e"ented by ettin, (ayout o&tion to cuto" and 'ith tanda(one radio1utton co"&onent. <ote
that in cuto" "odeE e(ect7neRadio ite(+ doe not render any out&ut.
<p:selectOneCadio id'(customCadio( value'(./form=ean.option0( layout'(custom(>
<f:selectItem item7a-el'(Option *( item@alue'(*( />
<f:selectItem item7a-el'(Option A( item@alue'(A( />
<f:selectItem item7a-el'(Option )( item@alue'()( />
</p:selectOneCadio>
417
<h:panelIrid columns'()(>
<p:radio=utton id'(opt*( for'(customCadio( itemInde&'(0(/>
<h:output7a-el for'(opt*( value'(Option *( />
<p:spinner />
<p:radio=utton id'(optA( for'(customCadio( itemInde&'(*(/>
<h:output7a-el for'(optA( value'(Option A( />
<p:input!e&t />
<p:radio=utton id'(opt)( for'(customCadio( itemInde&'(A(/>
<h:output7a-el for'(opt)( value'(Option )( />
<p:calendar />
</h:panelIrid>
Radio1utton +or attribute hou(d re+er to a e(ect7neRadio co"&onent and ite"Inde0 &oint to the
inde0 o+ the e(ectIte". When uin, cuto" (ayout o&tionE e(ect7neRadio co"&onent hou(d be
&(aced above any radio1utton that &oint to the e(ect7neRadio.
S+innin&
Se(ect7neRadio reide in a "ain container 'hich style and styleClass attribute a&&(y. A 3innin,
)tyle #lass Applies
.uiBe(ectoneradio 8ain container e(e"ent.
.uiBradiobutton *ontainer o+ a radio button.
.uiBradiobuttonBbo0 *ontainer o+ radio button icon.
.uiBradiobuttonBicon Radio button icon.
418
#.1:8 Separator
Se&erator di&(ay a hori=onta( (ine to e&arate content.
In%o
9a, separator
*o"&onent *(a org.primefaces.component.separator.)eparator
*o"&onent 9y&e org.primefaces.component.)eparator
Renderer 9y&e org.primefaces.component.)eparator
Renderer *(a org.primefaces.component.separator.)eparator
Attributes
be rendered.
ty(e nu(( Strin, In(ine ty(e o+ the e&arator.
ty(e*(a nu(( Strin, Sty(e c(a o+ the e&arator.
)ettin& started with Separator
In it i"&(et +or"E e&arator i ued aK
//content
<p:separator />
//content
Dimensions
Se&arator render a @hr AB ta, 'hich ty(e and ty(e*(a o&tion a&&(y.
419
<p:separator style'(width:500p&;height:A0p&( />
Special Separators
Se&arator can be ued inide other co"&onent uch a "enu 'hen u&&orted.
<p:menu>
//su-menu or menuitem
<p:separator />
//su-menu or menuitem
</p:menu>
S+innin&
A "entioned in di"enion ectionE ty(e and ty(e*(a o&tion can be ued to ty(e the e&arator.
#lass Applies
.uiBe&arator Se&arator e(e"ent
420
#.11: SlideMenu
S(ide8enu i ued to di&(ay neted ub"enu 'ith (idin, ani"ation.
In%o
9a, slide!enu
*o"&onent *(a org.primefaces.component.slidemenu.)lide!enu
*o"&onent 9y&e org.primefaces.component.)lide!enu
Renderer 9y&e org.primefaces.component.)lide!enuenderer
Renderer *(a org.primefaces.component.slidemenu.)lide!enuenderer
Attributes
be rendered.
"ode( nu(( 8enu8ode( 8enu8ode( intance +or &ro,ra""atic "enu.
bac36abe( 1ac3 Strin, 9e0t +or bac3 (in3.
tri,,er nu(( Strin, Id o+ the co"&onent 'hoe tri,,erEvent 'i(( ho'
the dyna"ic &oitioned "enu.
421
over(ay +a(e 1oo(ean De+ine &oitionin,E 'hen enab(ed "enu i
di&(ayed 'ith abo(ute &oition re(ative to the
tri,,er. De+au(t i +a(eE "eanin, tatic &oitionin,.
tri,,erEvent c(ic3 Strin, Event na"e o+ tri,,er that 'i(( ho' the dyna"ic
&oitioned "enu.
)ettin& started with the SlideMenu
S(ide8enu conit o+ ub"enu and "enuite"E ub"enu can be neted and each neted ub"enu
'i(( be di&(ayed 'ith a (ide ani"ation.
<p:slide5enu>
<p:su-menu la-el'(<,a& 5enuitems( icon'(ui3icon3refresh(>
<p:menuitem value'(8ave( action7istener'(./-utton=ean.save0(
update'(messages( icon'(ui3icon3dis2( />
<p:menuitem value'(Kpdate( action7istener'(./-utton=ean.update0(
update'(messages( icon'(ui3icon3arrowrefresh3*3w( />
</p:su-menu>
<p:su-menu la-el'(Jon3<,a& 5enuitem( icon'(ui3icon3newwin(>
update'(messages( a,a&'(false( icon'(ui3icon3close(/>
</p:su-menu>
<p:separator />
<p:su-menu la-el'(Javigations( icon'(ui3icon3e&tlin2(>
<p:su-menu la-el'(#rime 7in2s(>
<p:menuitem value'(#rime( url'(http://www.prime.com.tr( />
<p:menuitem value'(#rime6aces( url'(http://www.primefaces.org( />
</p:su-menu>
<p:menuitem value'(5o-ile( url'(/mo-ile( />
</p:su-menu>
</p:slide5enu>
;erlay
S(ide8enu can be &oitioned re(ative to a tri,,er co"&onentE +o((o'in, a"&(e attache a
(ide8enu to the button o that 'henever the button i c(ic3ed "enu 'i(( be di&(ayed in an over(ay
ite(+.
<p:command=utton type'(-utton( value'(8how( id'(-tn( />
<p:slide5enu trigger'(-tn( my'(left top( at'(left -ottom(>
//content
</p:slide5enu>
422
$lient Side API
Wid,etN PrimeFaces.widget.Slide-enu
a(i,n?@ B void A(i,n over(ay "enu 'ith tri,,er.
S+innin&
S(ide8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB"enu .uiB(ide"enu *ontainer e(e"ent o+ "enu.
.uiB(ide"enuB'ra&&er Wra&&er e(e"ent +or content.
.uiB(ide"enuBcontent *ontent container.
.uiB(ide"enuBbac3'ard 1ac3 navi,ator.
423
#.111 Slider
S(ider i ued to &rovide in&ut 'ith variou cuto"i=ation o&tion (i3e orientationE di&(ay "ode
and 3innin,.
In%o
9a, slider
*o"&onent *(a org.primefaces.component.slider.)lider
*o"&onent 9y&e org.primefaces.component.)lider
Renderer 9y&e org.primefaces.component.)liderenderer
Renderer *(a org.primefaces.component.slider.)liderenderer
Attributes
+or nu(( Strin, Id o+ the in&ut te0t that the (ider 'i(( be ued +or
di&(ay nu(( Strin, Id o+ the co"&onent to di&(ay the (ider va(ue.
"in>a(ue 0 Inte,er 8ini"u" va(ue o+ the (ider
"a0>a(ue 100 Inte,er 8a0i"u" va(ue o+ the (ider
ty(e nu(( Strin, In(ine ty(e o+ the container e(e"ent
ty(e*(a nu(( Strin, Sty(e c(a o+ the container e(e"ent
ani"ate true 1oo(ean 1oo(ean va(ue to enab(eQdiab(e the ani"ated "ove 'hen
bac3,round o+ (ider i c(ic3ed
ty&e hori=onta( Strin, Set the ty&e o+ the (iderE Ihori=onta(I or Ivertica(I.
te& 1 Inte,er #i0ed &i0e( incre"ent that the (ider "ove in
diab(ed 0 1oo(ean Diab(e or enab(e the (ider.
onS(ideStart nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (ide be,in.
424
onS(ide nu(( Strin, *(ient ide ca((bac3 to e0ecute durin, (idin,.
onS(ideEnd nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen (ide end.
ran,e +a(e 1oo(ean When enab(edE t'o hand(e are &rovided +or e(ection a
ran,e.
di&(ay9e"&(ate nu(( Strin, Strin, te"&(ate to ue 'hen u&datin, the di&(ay. >a(id
&(aceho(der are Vva(ueWE V"inW and V"a0W.
)ettin& started with Slider
S(ider reCuire an in&ut co"&onent to 'or3 'ithE for attribute i ued to et the id o+ the in&ut
co"&onent 'hoe in&ut 'i(( be &rovided by the (ider.
pu-lic class 8lider=ean /
private int num-er;
pu-lic int getJum-er9: /
return num-er;
0
pu-lic void setJum-er9int num-er: /
this.num-er ' num-er;
0
0
<h:input!e&t id'(num-er( value'(./slider=ean.num-er0( />
<p:slider for'(num-er( />
Display <alue
Uin, display +eatureE you can &reent a readon(y di&(ay va(ue and ti(( ue (ider to &rovide in&utE
in thi cae for hou(d re+er to a hidden in&ut to bind the va(ue.
<h:input4idden id'(num-er( value'(./slider=ean.num-er0( />
<h:output!e&t value'(8et ratio to F( />
<h:output!e&t id'(output( value'(./slider=ean.num-er0( />
<p:slider for'(num-er( display'(output( />
425
<ertical Slider
1y de+au(t (ider orientation i hori=onta(E vertica( (idin, i a(o u&&orted and can be et uin,
the type attribute.
<h:input!e&t id'(num-er( value'(./sliderontroller.num-er0( />
<p:slider for'(num-er( type'(vertical( min@alue'(0( ma&@alue'(A00(/>
Step
Ste& +actor de+ine the interva( bet'een each &oint durin, (idin,. De+au(t va(ue i one and it i
cuto"i=ed uin, step o&tion.
<p:slider for'(num-er( step'(*0( />
Animation
S(idin, i ani"ated by de+au(tE i+ you 'ant to turn it o+ ani"ate attribute et the animate o&tion to
+a(e.
.oundaries
8a0i"u" and "ini"u" boundarie +or the (idin, i de+ined uin, "in>a(ue and "a0>a(ue
attribute. #o((o'in, (ider can (ide bet'een B100 and H100.
<p:slider for'(num-er( min@alue'(3*00( ma&@alue'(*00(/>
"an&e Slider
Se(ectin, a ran,e 'ith "inB"a0 va(ue are u&&orted by (ider. 9o enab(e thi +eatureE et range
attribute to true and &rovide a co""a e&arate &air o+ in&ut +ie(d to attach "inB"a0 va(ue.
#o((o'in, a"&(e de"ontrate a ran,e (ider a(on, 'ith the di&(ay te"&(ate +eature +or +eedbac3K
426
<h:output!e&t id'(displayCange(
value'(=etween ./slider=ean.num-erU0 and ./slider=ean.num-erP0(/>

<p:slider for'(t&tUHt&tP( display'(displayCange( style'(width:E00p&( range'(true(
display!emplate'(=etween /min0 and /ma&0(/>

<h:input4idden id'(min( value'(./slider=ean.min0( />
<h:input4idden id'(ma&( value'(./slider=ean.ma&0( />
S(ider &rovide three ca((bac3 to hoo3Bin your cuto" /avacri&tE onS(ideStartE onS(ide and
onS(ideEnd. A(( o+ thee ca((bac3 receive t'o &ara"eterK (ide event and the ui ob/ect containin,
in+or"ation about the event.
<p:slider for'(num-er( on8lide$nd'(handle8lide$nd9eventH ui:(/>
function handle8lide$nd9eventH ui: /
//ui.helper ' 4andle element of slider
//ui.value ' urrent value of slider
0
A,a- .ehaior /ents
S(ider &rovide one a/a0 behavior event ca((ed slideEnd that i +ired 'hen the (ide co"&(ete. I+
you have a (itener de+inedE it 'i(( be ca((ed by &ain, org.primefaces.event.SlideEndEvent
intance. E0a"&(e be(o' add a "ea,e and di&(ay it uin, ,ro'( co"&onent 'hen (ide end.
<p:slider for'(num-er(>
<p:a,a& event'(slide$nd( listener'(./slider=ean.on8lide$nd0( update'(msgs( />
</p:slider>
<p:messages id'(msgs( />
427
pu-lic class 8lider=ean /
private int num-er;
pu-lic int getJum-er9: /
return num-er;
0
pu-lic void setJum-er9int num-er: /
this.num-er ' num-er;
0
pu-lic void on8lide$nd98lide$nd$vent event: /
int value ' event.get@alue9:;
//add faces message
0
0
$lient Side API
Wid,etN PrimeFaces.widget.Slider
,et>a(ue?@ B <u"ber Return the current va(ue
et>a(ue?va(ue@ va(ueN >a(ue to et void U&date (ider va(ue 'ith
&rovided one.
diab(e?@ inde0N Inde0 o+ tab to diab(e void Diab(e (ider.
enab(e?@ inde0N Inde0 o+ tab to enab(e void Enab(e (ider.
S+innin&
S(ider reide in a "ain container 'hich style and styleClass attribute a&&(y. 9hee attribute are
handy to &eci+y the di"enion o+ the (ider. #o((o'in, i the (it o+ tructura( ty(e c(aeK
#lass Applies
.uiB(ider 8ain container e(e"ent
.uiB(iderBhori=onta( 8ain container e(e"ent o+ hori=onta( (ider
.uiB(iderBvertica( 8ain container e(e"ent o+ vertica( (ider
.uiB(iderBhand(e S(ider hand(e
428
#.112 Spotli&ht
S&ot(i,ht hi,h(i,ht a certain co"&onent on &a,e.
In%o
9a, spotlig"t
*o"&onent *(a org.primefaces.component.spotlig"t.)potlig"t
*o"&onent 9y&e org.primefaces.component.)potlig"t
Renderer 9y&e org.primefaces.component.)potlig"tenderer
Renderer *(a org.primefaces.component.spotlig"t.)potlig"tenderer
Attributes
rendered +a(e 1oo(ean 1oo(ean va(ue to &eci+y the renderin, o+ the co"&onentE
tar,et nu(( Strin, *o"&onent to hi,h(i,ht.
ani"ate true 1oo(ean *ontro( ani"ation ued durin, hi,h(i,ht.
429
)ettin& started with Spotli&ht
S&ot(i,ht i acceed uin, c(ient ide a&i. *(ic3in, the button hi,h(i,ht the &ane( be(o'K
<p:panel id'(pnl( header'(#anel(>
//content
</p:panel>
<p:command=utton value'(4ighlight( onclic2'(#69?spot?:.show9:( />
<p:spotlight target'(pnl( widget@ar'(spot( />
$lient Side API
Wid,etN PrimeFaces.widget.Spotlight
ho'?@ B void .i,h(i,ht tar,et.
hide?@ B void Re"ove hi,h(i,ht.
S+innin&
S(ider reide in a "ain container 'hich style and styleClass attribute a&&(y. 9hee attribute are
handy to &eci+y the di"enion o+ the (ider. A 3innin, ty(e c(ae are ,(oba(E ee the "ain
the"in, ection +or "ore in+or"ation. #o((o'in, i the (it o+ tructura( ty(e c(aeK
#lass Applies
.uiB&ot(i,ht 8a3 e(e"entE co""on to a(( re,ion.
.uiB&ot(i,htBto& 9o& "a3 e(e"ent.
.uiB&ot(i,htBbotto" 1otto" "a3 e(e"ent.
.uiB&ot(i,htB(e+t 6e+t "a3 e(e"ent.
.uiB&ot(i,htBri,ht Ri,ht "a3 e(e"ent.
430
#.11' Soc+et
Soc3et co"&onent i an a,ent that create a &uh channe( bet'een the erver and the c(ient.
In%o
9a, soc,et
*o"&onent *(a org.primefaces.component.soc,et.)oc,et
*o"&onent 9y&e org.primefaces.component.)oc,et
Renderer 9y&e org.primefaces.component.)oc,etenderer
Renderer *(a org.primefaces.component.soc,et.)oc,etenderer
Attributes
rendered.
channe( nu(( 7b/ect *hanne( na"e o+ the connection.
tran&ort 'eboc3et Strin, Deired &rotoco( to be ued va(id va(ue are
'eboc3et ?de+au(t@E eE trea"in,E (on,B&o((in,E
/on&.
+a((bac39ran&ort (on,B&o((in, Strin, #a((bac3 &rotoco( to be ued 'hen deired tran&ort
i not u&&orted in environ"entE va(id va(ue are
'eboc3etE eE trea"in,E (on,B&o((in, ?de+au(t@E
/on&.
on8ea,e nu(( Strin, Aavacri&t event hand(er that i &roceed 'hen
erver &ub(ihe data.
onError nu(( Strin, Aavacri&t event hand(er that i &roceed 'hen
there i an error.
on*(oe nu(( Strin, Aavacri&t event hand(er +or on*(oe ca((bac3 o+
at"o&here.
on7&en nu(( Strin, Aavacri&t event hand(er +or on7&en ca((bac3 o+
at"o&here.
onReconnect nu(( Strin, Aavacri&t event hand(er +or onReconnect ca((bac3
o+ at"o&here.
431
on8ea,e!ub(ihed nu(( Strin, Aavacri&t event hand(er +or on8ea,e!ub(ihed
ca((bac3 o+ at"o&here.
on9ran&ort#ai(ure nu(( Strin, Aavacri&t event hand(er +or on9ran&ort#ai(ure
on6oca(8ea,e nu(( Strin, Aavacri&t event hand(er +or on6oca(8ea,e
auto*onnect true 1oo(ean *onnect to channe( on &a,e (oad 'hen enab(ed.
)ettin& Started with the Soc+et
See cha&ter 5E I!ri"e#ace !uhI +or detai(ed in+or"ation.
432
#.113 Spacer
S&acer i ued to &ut &ace bet'een e(e"ent.
In%o
9a, spacer
*o"&onent *(a org.primefaces.component.spacer.)pacer
*o"&onent 9y&e org.primefaces.component.)pacer
Renderer 9y&e org.primefaces.component.)pacerenderer
Renderer *(a org.primefaces.component.spacer.)pacerenderer
Attributes
be rendered.
ty(e nu(( Strin, In(ine ty(e o+ the &acer.
ty(e*(a nu(( Strin, Sty(e c(a o+ the &acer.
'idth nu(( Strin, Width o+ the &ace.
hei,ht nu(( Strin, .ei,ht o+ the &ace.
)ettin& started with Spacer
S&acer i ued by either &eci+yin, 'idth or hei,ht o+ the &ace.
8pacer in this e&ample separates this te&t <p:spacer width'(*00( height'(*0(> and
<p:spacer width'(*00( height'(*0(> this te&t.
433
#.115 Spinner
S&inner i an in&ut co"&onent to &rovide a nu"erica( in&ut via incre"ent and decre"ent button.
In%o
9a, spinner
*o"&onent *(a org.primefaces.component.spinner.)pinner
*o"&onent 9y&e org.primefaces.component.)pinner
Renderer 9y&e org.primefaces.component.)pinnerenderer
Renderer *(a org.primefaces.component.spinner.)pinnerenderer
Attributes
be rendered.
Strin,
i""ediate +a(e 1oo(ean 1oo(ean va(ue that &eci+ie the (i+ecyc(e &hae the
va(ue*han,eEvent hou(d be &roceedE 'hen true
the event 'i(( be +ired at Ia&&(y reCuet va(ueIE i+
i""ediate i et to +a(eE va(ue*han,e Event are
+ired in I&roce va(idationI
&hae
reCuired #a(e 1oo(ean 8ar3 co"&onent a reCuired
E0&r
"ethod va(idation, the in&ut
434
E0&r
"ethod +or hand(in, a va(uchan,eevent
va(idation +ai(.
te&#actor 1 Doub(e Ste&&in, +actor +or each incre"ent and decre"ent
"in nu(( Doub(e 8ini"u" boundary va(ue
"a0 nu(( Doub(e 8a0i"u" boundary va(ue
&re+i0 nu(( Strin, !re+i0 o+ the in&ut
u++i0 nu(( Strin, Su++i0 o+ the in&ut
in&ut e(e"ent.
(oe +ocu.
,ainin, +ocu.
onc(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
i c(ic3ed.
ondb(c(ic3 nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen in&ut e(e"ent
i doub(e c(ic3ed.
receive +ocu.
435
chan,e by the uer.
i=e nu(( Inte,er <u"ber o+ character ued to deter"ine the 'idth
o+ the in&ut e(e"ent.
)ettin& Started with Spinner
S&inner i an in&ut co"&onent and ued /ut (i3e a tandard in&ut te0t.
pu-lic class 8pinner=ean /
private int num-er;
//getter and setter
0
<p:spinner value'(./spinner=ean.num-er0( />
436
Step Factor
7ther than inte,erE &inner a(o u&&ort deci"a( o the +ractiona( &art can be contro((er 'ith
&inner a 'e((. #or deci"a( ue the te&#actor attribute to &eci+y te&&in, a"ount. #o((o'in,
e0a"&(e ue a te&#actor 0.%5.
<p:spinner value'(./spinner=ean.num-er0( step6actor'(0.A5(/>
pu-lic class 8pinner=ean /
private dou-le num-er;
//getter and setter
0
7ut&ut o+ thi &inner 'ou(d beK
A+ter an incre"ent ha&&en a cou&(e o+ ti"e.
Pre%i- and Su%%i-
!re+i0 and Su++i0 o&tion enab(e &(acin, +i0ed trin, on in&ut +ie(d. <ote that you 'ou(d need to
ue a converter to avoid converion error ince &re+i0Qu++i0 'i(( a(o be &oted.
<p:spinner value'(./spinner=ean.num-er0( prefi&'(V( />
.oundaries
In order to retrict the boundary va(ueE ue min and ma$ o&tion.
<p:spinner value'(./spinner=ean.num-er0( min'(0( ma&'(*00(/>
A,a- Spinner
S&inner can be a/a0i+ied uin, c(ient behavior (i3e +Na/a0 or &Na/a0. In e0a"&(e be(o'E an a/a0
reCuet i done to u&date the out&utte0t 'ith ne' va(ue 'henever a &inner button i c(ic3ed.
<p:spinner value'(./spinner=ean.num-er0(>
<p:a,a& update'(display( />
</p:spinner>
<h:output!e&t id'(display( value'(./spinner=ean.num-er0( />
437
S+innin&
S&inner reide in a container e(e"ent that uin, style and styleClass a&&(ie. #o((o'in, i the (it o+
#lass Applies
.uiB&inner 8ain container e(e"ent o+ &inner
.uiB&innerBin&ut In&ut +ie(d
.uiB&innerBbutton S&inner button
.uiB&innerBbuttonBu& Incre"ent button
.uiB&innerBbuttonBdo'n Decre"ent button
438
#.116 Split.utton
S&(it1utton di&(ay a co""and by de+au(t and additiona( one in an over(ay.

In%o
9a, split%utton
*o"&onent *(a org.primefaces.component.split&utton.)plit%utton
*o"&onent 9y&e org.primefaces.component.)plit%utton
Renderer 9y&e org.primefaces.component.)plit%uttonenderer
Renderer *(a org.primefaces.component.split&utton.)plit%uttonenderer
Attributes
va(ue nu(( Strin, 6abe( +or the button
Strin,
&roceed 'hen button i c(ic3ed.
action6itener nu(( 8ethodE0&r An action(itener thatd be &roceed 'hen button i
c(ic3ed.
ty&e ub"it Strin, Set the behavior o+ the button.
439
be,in.
co"&(eted.
ucceed.
ty(e nu(( Strin, In(ine ty(e o+ the button e(e"ent.
ty(e*(a nu(( Strin, Sty(e*(a o+ the button e(e"ent.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button (oe +ocu
and it va(ue ha been "odi+ied ince ,ainin, +ocu.
c(ic3ed.
on+ocu nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen button receive
+ocu.
do'n over button.
440
over button.
"oved 'ithin button.
"oved onto button.
one(ect nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen te0t 'ithin button i
e(ected by uer.
button.
a(t nu(( Strin, A(ternate te0tua( decri&tion o+ the button.
diab(ed +a(e 1oo(ean Diab(e the button.
by the uer.
icon nu(( Strin, Icon o+ the button a a c c(a.
icon!o (e+t Strin, !oition o+ the icon.
441
)ettin& started with Split.utton
S&(it1utton ua,e i i"i(ar to a re,u(ar co""and1utton. Additiona( co""and are &(aced inide
the co"&onent and di&(ayed in an over(ay. In e0a"&(e be(o'E c(ic3in, the ave button invo3e ave
"ethod o+ the bean and u&date "ea,e. <eted o&tion de+ined a "enuite" do a/a0E nonBa/a0
reCuet a 'e(( a re,u(ar navi,ation to an e0terna( ur(.
<p:split=utton value'(8ave( action7istener'(./-utton=ean.save0( update'(messages(
icon'(ui3icon3dis2(>
update'(messages( icon'(ui3icon3arrowrefresh3*3w(/>
<p:menuitem value'(Delete( action7istener'(./-utton=ean.delete0( a,a&'(false(
icon'(ui3icon3close(/>
<p:separator />
<p:menuitem value'(4omepage( url'(http://www.primefaces.org(
icon'(ui3icon3e&tlin2(/>
</p:split=utton>
$lient Side API
Wid,etN PrimeFaces.widget.Split)utton
ho'?@ B void Di&(ay over(ay.
hide?@ B void .ide over(ay.
S+innin&
S&(it1utton render a container e(e"ent 'hich style and styleClass a&&(ie. #o((o'in, i the (it o+
)tyle #lass Applies
.uiB&(itbutton *ontainer e(e"ent.
.uiB&(itbuttonB"enubutton Dro&do'n button
.uiB"enu *ontainer e(e"ent o+ "enu
442
#.117 Submenu
Sub"enu i neted in "enu co"&onent and re&reent a ub "enu ite".

In%o
9a, su&menu
*o"&onent *(a org.primefaces.component.su&menu.)u&menu
*o"&onent 9y&e org.primefaces.component.)u&menu
Attributes
rendered.
(abe( nu(( Strin, 6abe( o+ the ub"enu header.
icon nu(( Strin, Icon o+ a ub"enuE ee "enuite" to ee ho' it i ued
ty(e nu(( Strin, In(ine ty(e o+ the ub"enu.
ty(e*(a nu(( Strin, Sty(e c(a o+ the ub"enu.
)ettin& started with Submenu
!(eae ee 8enu or 8enubar ection to +ind out ho' ub"enu i ued 'ith the "enu.
443
#.118 Stac+
Stac3 i a navi,ation co"&onent that "i"ic the tac3 +eature in 8ac 7S F.

In%o
9a, stac,
*o"&onent *(a org.primefaces.component.stac,.)tac,
*o"&onent 9y&e org.primefaces.component.)tac,
Renderer 9y&e org.primefaces.component.)tac,enderer
Renderer *(a org.primefaces.component.stac,.)tac,enderer
Attributes
icon nu(( Strin, An o&tiona( i"a,e to contain tac3ed ite".
o&enS&eed )00 Strin, S&eed o+ the ani"ation 'hen o&enin, the tac3.
c(oeS&eed )00 Inte,er S&eed o+ the ani"ation 'hen o&enin, the tac3.
"ode( nu(( 8enu8ode( 8enu8ode( intance to create "enu &ro,ra""atica((y
e0&anded +a(e 1oo(ean Whether to di&(ay tac3 a e0&anded or not.
444
)ettin& started with Stac+
Each ite" in the tac3 i re&reented 'ith "enuite". Stac3 be(o' ha +ive ite" 'ith di++erent
icon and (abe(.
<p:stac2 icon'(/images/stac2/stac2.png(>
<p:menuitem value'(<perture( icon'(/images/stac2/aperture.png( url'(.(/>
<p:menuitem value'(#hotoshop( icon'(/images/stac2/photoshop.png( url'(.(/>
//...
</p:stac2>
Initia((y tac3 'i(( be rendered in co((a&ed "odeK
*ocation
Stac3 i a +i0ed &oitioned e(e"ent and (ocation can be chan,e via c. 9here one i"&ortant c
e(ector +or tac3 ca((ed .ui1stac". 7verride thi ty(e to chan,e the (ocation o+ tac3.
.ui3stac2 /
-ottom: AGp&;
right: E0p&;
0
Dynamic Menus
S+innin&
#lass Applies
.uiBtac3 8ain container e(e"ent o+ tac3
.uiBtac3 u( (i Each ite" in tac3
.uiBtac3 u( (i i", Icon o+ a tac3 ite"
.uiBtac3 u( (i &an 6abe( o+ a tac3 ite"
445
#.12: Stic+y
Stic3y co"&onent &oition other co"&onent a +i0ed o that thee co"&onent tay in 'indo'
vie'&ort durin, cro((in,.
In%o
9a, stic,y
*o"&onent *(a org.primefaces.component.stic,y.)tic,y
*o"&onent 9y&e org.primefaces.component.)tic,y
Renderer 9y&e org.primefaces.component.)tic,yenderer
Renderer *(a org.primefaces.component.stic,y.)tic,yenderer
Attributes
tar,et nu(( Strin, *o"&onent to "a3e tic3y.
"ar,in 0 Inte,er 8ar,in to the to& o+ the &a,e durin, +i0ed cro((in,.
446
)ettin& started with Stic+y
Stic3y reCuire a tar,et to 3ee& in vie'&ort on cro((. .ere i a tic3y too(barK
<p:tool-ar id'(t-(>
<p:tool-arIroup align'(left(>
<p:command=utton type'(-utton( value'(Jew( icon'(ui3icon3document( />
<p:command=utton type'(-utton( value'(Open( icon'(ui3icon3folder3open(/>
<p:separator />
<p:command=utton type'(-utton( title'(8ave( icon'(ui3icon3dis2(/>
<p:command=utton type'(-utton( title'(Delete( icon'(ui3icon3trash(/>
<p:command=utton type'(-utton( title'(#rint( icon'(ui3icon3print(/>
</p:tool-arIroup>
</p:tool-ar>
<p:stic2y target'(t-( />
S+innin&
9here are no viua( ty(e o+ tic3y ho'everE ui1stic"y c(a i a&&(ied to the tar,et 'hen the &oition
i +i0ed. When tar,et i retored to it ori,ina( (ocation thi i re"oved.
447
#.121 Sub1able
Sub9ab(e i a he(&er co"&onent o+ datatab(e ued +or ,rou&in,.
In%o
9a, su&Ta&le
*o"&onent *(a org.primefaces.component.su&ta&le.)u&Ta&le
*o"&onent 9y&e org.primefaces.component.)u&Ta&le
Renderer 9y&e org.primefaces.component.)u&Ta&leenderer
Renderer *(a org.primefaces.component.su&ta&le.)u&Ta&leenderer
Attributes
va(ue nu(( 7b/ect Data o+ the co"&onent.
var nu(( Strin, <a"e o+ the data iterator.
)ettin& started with Sub1able
See Data9ab(e ection +or "ore in+or"ation.
448
#.122 Summary"ow
Su""aryRo' i a he(&er co"&onent o+ datatab(e ued +or dyna"ic ,rou&in,.
In%o
9a, summaryo0
*o"&onent *(a org.primefaces.component.summaryro0.)ummaryo0
*o"&onent 9y&e org.primefaces.component.)ummaryo0
Renderer 9y&e org.primefaces.component.)ummaryo0enderer
Renderer *(a org.primefaces.component.summaryro0.)ummaryo0enderer
Attributes
(itener nu(( 8ethodE0&r 8ethod e0&reion to e0ecute be+ore renderin, u""ary
ro'. ?e.,. to ca(cu(ate tota(@.
)ettin& started with Summary"ow
See Data9ab(e ection +or "ore in+or"ation.
449
#.12# 1ab
9ab i a ,eneric container co"&onent ued by other !ri"e#ace co"&onent uch a tab>ie' and
accordion!ane(.
In%o
9a, ta&
*o"&onent *(a org.primefaces.component.Ta&Vie0.Ta&
*o"&onent 9y&e org.primefaces.component.Ta&
Attributes
be rendered.
tit(e nu(( 1oo(ean 9it(e te0t o+ the tab
tit(eSty(e nu(( Strin, In(ine ty(e o+ the tab.
tit(eSty(e*(a nu(( Strin, Sty(e c(a o+ the tab.
diab(ed +a(e 1oo(ean Diab(e tab e(e"ent.
c(oab(e +a(e 1oo(ean 8a3e the tab c(oab(e 'hen enab(ed.
tit(eti& nu(( Strin, 9oo(ti& o+ the tab header.
)ettin& started with the 1ab
See the ection o+ co"&onent 'ho uti(i=e tab co"&onent +or "ore in+or"ation. A tab i a hared
co"&onentE not a(( attribute "ay a&&(y to the co"&onent that ue tab.
450
#.12' 1abMenu
9ab8enu i a navi,ation co"&onent that di&(ay "enuite" a tab.
In%o
9a, ta&!enu
*o"&onent *(a org.primefaces.component.ta&menu.Ta&!enu
*o"&onent 9y&e org.primefaces.component.Ta&!enu
Renderer 9y&e org.primefaces.component.Ta&!enuenderer
Renderer *(a org.primefaces.component.ta&menu.Ta&!enuenderer
Attributes
be rendered.
"ode( nu(( 8enu8ode( 8enu8ode( intance to bui(d "enu dyna"ica((y.
activeInde0 0 Inte,er Inde0 o+ the active tab.
)ettin& started with 1abMenu
9ab8enu reCuire "enuite" a chi(dren co"&onentE each "enuite" i rendered a a tab. Aut (i3e
in any other "enu co"&onentE "enuite" can be uti(i=ed to do a/a0 reCuetE nonBa/a0 reCuet and
i"&(e GE9 navi,ation.
451
<p:ta-5enu activeInde&'(0(>
<p:menuitem value'(Overview( outcome'(main( icon'(ui3icon3star(/>
<p:menuitem value'(Demos( outcome'(demos( icon'(ui3icon3search( />
<p:menuitem value'(Documentation( outcome'(docs( icon'(ui3icon3document(/>
<p:menuitem value'(8upport( outcome'(support( icon'(ui3icon3wrench(/>
<p:menuitem value'(8ocial( outcome'(social( icon'(ui3icon3person( />
</p:ta-5enu>
S+innin& 1abMenu
9ab8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiBtab"enu 8ain container e(e"ent.
.uiBtab"enuBnav *ontainer +or tab.
.uiBtab"enuite" 8enuite" container.
.uiB"enuite" Anchor o+ a "enuite".
452
#.123 1ab<iew
9ab>ie' i a container co"&onent to ,rou& content in tab.
In%o
9a, ta&Vie0
*o"&onent *(a org.primefaces.component. ta&vie0.Ta&Vie0
*o"&onent 9y&e org.primefaces.component.Ta&Vie0
Renderer 9y&e org.primefaces.component.Ta&Vie0enderer
Renderer *(a org.primefaces.component.ta&vie0.Ta&Vie0enderer
Attributes
rendered.
'id,et>ar nu(( Strin, >ariab(e na"e o+ the c(ient ide 'id,et.
activeInde0 0 Inte,er Inde0 o+ the active tab.
e++ect nu(( Strin, <a"e o+ the tranition e++ect.
e++ectDuration nu(( Strin, Duration o+ the tranition e++ect.
dyna"ic +a(e 1oo(ean Enab(e (a=y (oadin, o+ inactive tab.
453
cache true 1oo(ean When tab content are (a=y (oaded by a/a0
to,,(e8odeE cachin, on(y retrieve the tab content
once and ubeCuent to,,(e o+ a cached tab doe not
co""unicate 'ith erver. I+ cachin, i turned o++E tab
content are re(oaded +ro" erver each ti"e tab i
c(ic3ed.
on9ab*han,e nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a tab i c(ic3ed.
on9abSho' nu(( Strin, *(ient ide ca((bac3 to e0ecute 'hen a tab i ho'n.
on9ab*(oe nu(( Strin, *(ient ide ca((bac3 to e0ecute on tab c(oe.
var nu(( Strin, <a"e o+ iterator to re+er an ite" in co((ection.
va(ue nu(( 7b/ect *o((ection "ode( to di&(ay dyna"ic tab.
orientation to& Strin, 7rientation o+ tab header.
cro((ab(e +a(e 1oo(ean When enab(edE tab header can be cro((ed
hori=onta((y intead o+ 'ra&&in,.
&re&endId true 1oo(ean 9ab>ie' i a na"in, container thu &re&end it id to
it chi(dren by de+au(tE a +a(e va(ue turn thi
behavior o++ e0ce&t +or dyna"ic tab.
)ettin& started with the 1ab<iew
9ab>ie' reCuire one "ore chi(d tab co"&onent to di&(ay. 9it(e can a(o be de+ined by uin,
tit(e +acet.
<p:ta-@iew>
<p:ta- title'(!a- One(>
<h:output!e&t value'(7orem( />
</p:ta->
<p:ta- title'(!a- !wo(>
</p:ta->
<p:ta- title'(!a- !hree(>
<h:output!e&t value'(Dolor( />
</p:ta->
</p:ta-@iew>
454
Dynamic 1abs
9herere t'o to,,(e8ode in tabvie'E non1dynamic ?de+au(t@ and dynamic. 1y de+au(tE a(( tab
content are rendered to the c(ientE on the other hand in dyna"ic "odeE on(y the active tab content
are rendered and 'hen an inactive tab header i e(ectedE content i (oaded 'ith a/a0. Dyna"ic
"ode i handy in reducin, &a,e i=eE ince inactive tab are (a=y (oadedE &a,e 'i(( (oad +ater. 9o
enab(e dyna"ic (oadin,E i"&(y et dynamic o&tion to true.
<p:ta-@iew dynamic'(true(>
//ta-s
</p:ta-@iew>
$ontent $achin&
Dyna"ica((y (oaded tab cache their content by de+au(tE by doin, oE reactivatin, a tab doent
reu(t in an a/a0 reCuet ince content are cached. I+ you 'ant to re(oad content o+ a tab each ti"e a
tab i e(ectedE turn o++ cachin, by cache to +a(e.
/%%ects
*ontent tranition e++ect are contro((ed 'ith effect and effect'uration attribute. E++ectDuration
&eci+ie the &eed o+ the e++ectE slowE normal ?de+au(t@ and fast are the va(id o&tion.
<p:ta-@iew effect'(fade( effectDuration'(fast(>
//ta-s
</p:ta-@iew>
A,a- .ehaior /ents
tabChange and tabClose are the a/a0 behavior event o+ tabvie' that are e0ecuted 'hen a tab i
chan,ed and c(oed re&ective(y. .ere i an e0a"&(e o+ a tab*han,e behavior i"&(e"entationK
<p:ta-@iew>
<p:a,a& event'ta-hange listener'./-ean.onhange0 />
//ta-s
</p:ta-@iew>
pu-lic void onhange9!a-hange$vent event: /
//!a- active!a- ' event.get!a-9:;
//...
0
Mour (itener?i+ de+ined@ 'i(( be invo3ed 'ith an org.primefaces.event.TabChangeEvent intance
that contain a re+erence to the ne' active tab and the accordion &ane( ite(+. #or tab*(oe eventE
(itener 'i(( be &aed an intance o+ org.primefaces.event.TabCloseEvent.
Dynamic 0umber o% 1abs
When the tab to di&(ay are not taticE ue the bui(tBin iteration +eature i"i(ar to uiNre&eat.
455
<p:ta-@iew value'(./-ean.list0( var'(listItem(>
<p:ta- title'(./listItem.property<0(>
<h:output!e&t value' (./listItem.property=0(/>
...5ore content
</p:ta->
</p:ta-@iew>
;rientations
#our di++erent orientation are avai(ab(eK topdefault!E leftE right and bottom.
<p:ta-@iew orientation'(left(>
//ta-s
</p:ta-@iew>
Scrollable 1abs
9ab header 'ra& to the ne0t (ine in cae there i not enou,h &ace at header area by de+au(t. Uin,
cro((ab(e +eatureE it i &oib(e to 3ee& header a(i,ned hori=onta((y and ue navi,ation button to
acce hidden header.
<p:ta-@iew scrolla-le'(true(>
//ta-s
</p:ta-@iew>
9abvie' ha three ca((bac3 +or c(ient ide. onTabChange i e0ecuted 'hen an inactive tab i
c(ic3edE onTabShow i e0ecuted 'hen an inactive tab beco"e active to be ho'n and onTabClose
'hen a c(oab(e tab i c(oed. A(( thee ca((bac3 receive inde0 &ara"eter a the inde0 o+ tab.
456
<p:ta-@iew on!a-hange'(handle!a-hange9inde&:(>
//ta-s
</p:ta-@iew>
function handle!a-hange9i: /
//i ' Inde& of the new ta-
0
$lient Side API
Wid,etN PrimeFaces.widget.Tab2iew
e(ect?inde0@ inde0N Inde0 o+ tab to di&(ay void Activate tab 'ith ,iven inde0
e(ect9ab?inde0@ inde0N Inde0 o+ tab to di&(ay void ?De&recatedE ue e(ect intead@
Activate tab 'ith ,iven inde0
diab(e?inde0@ inde0N Inde0 o+ tab to diab(e void Diab(e tab 'ith ,iven inde0
enab(e?inde0@ inde0N Inde0 o+ tab to enab(e void Enab(e tab 'ith ,iven inde0
re"ove?inde0@ inde0N Inde0 o+ tab to re"ove void Re"ove tab 'ith ,iven inde0
,et6en,th?@ B <u"ber Return the nu"ber o+ tab
,etActiveInde0?@ B <u"ber Return inde0 o+ current tab
S+innin&
A 3innin, ty(e c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation. #o((o'in,
i the (it o+ tructura( ty(e c(ae.
#lass Applies
.uiBtab 8ain tabvie' container e(e"ent
.uiBtabBVorientationW 7rientation &eci+ic ?to&E botto"E ri,hE (e+t@ container.
.uiBtabBnav 8ain container o+ tab header
.uiBtabB&ane( Each tab container
.uiBtabBcro((ab(e *ontainer e(e"ent o+ a cro((ab(e tabvie'.
457
#.125 1a&$loud
9a,*(oud di&(ay a co((ection o+ ta, 'ith di++erent tren,th.
In%o
9a, tag#loud
*o"&onent *(a org.primefaces.component.tagcloud.Tag#loud
*o"&onent 9y&e org.primefaces.component.Tag#loud
Renderer 9y&e org.primefaces.component.Tag#loudenderer
Renderer *(a org.primefaces.component.tagcloud.Tag#loudenderer
Attributes
rendered.
"ode( nu(( 9a,*(oud8ode( 1ac3in, ta, c(oud "ode(.
)ettin& started with the 1a&$loud
9a,*(oud reCuire a bac3end 9a,*(oud "ode( to di&(ay.
<p:tagloud model'(./tagloud=ean.model0( />
458
pu-lic class !agloud=ean /
private !agloud5odel model;

pu-lic !agloud=ean9: /
model ' new Default!agloud5odel9:;
model.add!ag9new Default!agloudItem9(!ransformers(H (.(H *::;
//more
0
//getter
0
Selectin& 1a&s
An ite" i ta,*(oud can be e(ected uin, select a/a0 behavior. <ote that on(y ite" 'ith nu(( ur(
can be e(ected.
<h:form>
<p:growl id'(msg( showDetail'(true( />
<p:tagloud model'(./tagloud=ean.model0(>
<p:a,a& event'(select( update'(msg( listener'(./tagloud=ean.on8elect0( />
</p:tagloud>
</h:form>
pu-lic class !agloud=ean /
//modelH getter and setter
pu-lic void on8elect98elect$vent event: /
!agloudItem item ' 9!agloudItem: event.getO-,ect9:;
6aces5essage msg ' new 6aces5essage96aces5essage.8$@$CI!"LIJ6OH
(Item 8elected(H item.get7a-el9::;
0
0
1a&$loud API
org.primefaces.model.tagcloud.TagCloud-odel
!et"od Description
6itS9a,*6oudIte"T ,et9a,?@ Return a(( ta, in "ode(.
void add9a,?9a,*(oudIte" ite"@ Add a ta,.
void re"ove9a,?9a,*(oudIte" ite"@ Re"ove a ta,.
void c(ear?@ Re"ove a(( ta,.
!ri"e#ace &rovide org.primefaces.model.tagcloud.'efaultTagCloud-odel a the de+au(t
i"&(e"entation.
459
org.primefaces.model.tagcloud.TagCloud*tem
!et"od Description
Strin, ,et6abe(?@ Return (abe( o+ the ta,.
Strin, ,etUr(?@ Return ur( o+ the ta,.
int ,etStren,th?@ Return tren,th o+ the ta, bet'een 1 and 5.
org.primefaces.model.tagcloud.'efaultTagCloud*tem i &rovided a the de+au(t i"&(e"entation.
S+innin&
9a,*(oud reide in a container e(e"ent that style and styleClass attribute a&&(y. .ui1tagcloud
a&&(ie to "ain container and .ui1tagcloud1strength1CD6;E a&&(ie to each ta,. A 3innin, ty(e
c(ae are ,(oba(E ee the "ain the"in, ection +or "ore in+or"ation.
460
#.126 1erminal
9er"ina( i an a/a0 &o'ered 'eb baed ter"ina( that brin, de3to& ter"ina( to AS#.
In%o
9a, terminal
*o"&onent *(a org.primefaces.component.terminal.Terminal
*o"&onent 9y&e org.primefaces.component.Terminal
Renderer 9y&e org.primefaces.component.Terminalenderer
Renderer *(a org.primefaces.component.terminal.Terminalenderer
Attributes
rendered.
'e(co"e8ea,e nu(( Strin, We(co"e "ea,e to be di&(ayed on initia( (oad.
&ro"&t &ri"e _ Strin, !ri"ary &ro"&t te0t.
co""and.and(er nu(( 8ethodE0&r 8ethod to be ca((ed 'ith ar,u"ent to &roce.
461
)ettin& started with the 1erminal
A co""and hand(er i reCuired to inter&ret co""and entered in ter"ina(.
<p:terminal command4andler'(./terminal=ean.handleommand0( />
pu-lic class !erminal=ean /
pu-lic 8tring handleommand98tring commandH 8tringQS params: /
if9command.eBuals9(greet(::
return (4ello ( > paramsQ0S;
else if9command.eBuals9(date(::
return new Date9:.to8tring9:;
else
return command > ( not found(;
0
0
Whenever a co""and i ent to the erverE hand(e*o""and "ethod i invo3ed 'ith the co""and
na"e and the co""and ar,u"ent a a Strin, array.
$lient Side API
*(ient ide 'id,et e0&oe clear! and focus! "ethod. #o((o'in, ho' ho' to add +ocu on a
ter"ina( neted inide a dia(o,K
<p:command=utton type'(-utton( @alue'(<pply 6ocus( onclic2'(#69OtermO:.focus9:;(/>
<p:terminal widget@ar'(term( command4andler'(./terminal=ean.handleommand0( />
S+innin&
9er"ina( reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiBter"ina( 8ain container e(e"ent.
.uiBter"ina(Bcontent *ontent di&(ay o+ &reviou co""and 'ith re&one.
.uiBter"ina(B&ro"&t !ro"&t te0t.
#.127 1hemeSwitcher
9he"eS'itcher enab(e 'itchin, !ri"e#ace the"e on the +(y 'ith no &a,e re+reh.
462
In%o
9a, t"eme)0itc"er
*o"&onent *(a org.primefaces.component.t"emes0itc"er.T"eme)0itc"er
*o"&onent 9y&e org.primefaces.component.T"eme)0itc"er
Renderer 9y&e org.primefaces.component.T"eme)0itc"erenderer
Renderer *(a org.primefaces.component.t"emes0itc"er.T"eme)0itc"erenderer
Attributes
rendered.
e++ect +ade Strin, <a"e o+ the ani"ation.
e++ectS&eed -00 Inte,er Duration o+ the ani"ation in "i((iecond.
onchan,e nu(( Strin, *(ient ide ca((bac3 to e0ecute on the"e chan,e.
var nu(( Strin, >ariab(e na"e to re+er to each ite".
hei,ht nu(( Inte,er .ei,ht o+ the &ane(.
463
tabinde0 nu(( Inte,er !oition o+ the e(e"ent in the tabbin, order.
)ettin& Started with the 1hemeSwitcher
9he"eS'itcher ua,e i very i"i(ar to e(ect7ne8enu.
<p:theme8witcher style'(width:*50p&(>
<f:selectItem item7a-el'(hoose !heme( item@alue'(( />
<f:selectItems value'(./-ean.themes0( />
</p:theme8witcher>
State%ul 1hemeSwitcher
1y de+au(tE the"e'itcher /ut chan,e the the"e on the +(y 'ith no &a,e re+rehE in cae youd (i3e
to ,et noti+ied 'hen a uer chan,e the the"e ?e.,. to u&date uer &re+erence@E you can ue an a/a0
behavior.
<p:theme8witcher value'(./-ean.theme0( effect'(fade(>
<f:selectItems value'(./theme8witcher=ean.themes0( />
<p:a,a& listener'(./-ean.save!heme0( />
</p:theme8witcher>
Adanced 1hemeSwitcher
9he"eS'itcher u&&ort di&(ayin, cuto" content o that you can ho' the"e &revie'.
<p:theme8witcher>
<f:selectItems value'(./theme8witcher=ean.advanced!hemes0( var'(theme(
item7a-el'(./theme.name0( item@alue'(./theme0(/>

<p:column>
<p:graphicImage value'(/images/themes/./t.image0(/>
</p:column>

<p:column>
./t.name0
</p:column>
</p:theme8witcher>
464
#.128 1ieredMenu
9iered8enu i ued to di&(ay neted ub"enu 'ith over(ay.
In%o
9a, tiered!enu
*o"&onent *(a org.primefaces.component.tieredmenu.Tiered!enu
*o"&onent 9y&e org.primefaces.component.Tiered!enu
Renderer 9y&e org.primefaces.component.Tiered!enuenderer
Renderer *(a org.primefaces.component.tieredmenu.Tiered!enuenderer
Attributes
be rendered.
"ode( nu(( 8enu8ode( 8enu8ode( intance +or &ro,ra""atic "enu.
autoDi&(ay true 1oo(ean De+ine 'hether the +irt (eve( o+ ub"enu 'i(( be
di&(ayed on "oueover or not. When et to +a(eE
c(ic3 event i reCuired to di&(ay.
tri,,er nu(( Strin, Id o+ the co"&onent 'hoe tri,,erEvent 'i(( ho'
the dyna"ic &oitioned "enu.
465
over(ay +a(e 1oo(ean De+ine &oitionin,E 'hen enab(ed "enu i
di&(ayed 'ith abo(ute &oition re(ative to the
tri,,er. De+au(t i +a(eE "eanin, tatic &oitionin,.
tri,,erEvent c(ic3 Strin, Event na"e o+ tri,,er that 'i(( ho' the dyna"ic
&oitioned "enu.
)ettin& started with the 1ieredMenu
9iered8enu conit o+ ub"enu and "enuite"E ub"enu can be neted and each neted
ub"enu 'i(( be di&(ayed in an over(ay.
<p:tiered5enu>
<p:su-menu la-el'(<,a& 5enuitems( icon'(ui3icon3refresh(>
<p:menuitem value'(8ave( action7istener'(./-utton=ean.save0(
update'(messages( icon'(ui3icon3dis2( />
update'(messages( icon'(ui3icon3arrowrefresh3*3w( />
</p:su-menu>
<p:su-menu la-el'(Jon3<,a& 5enuitem( icon'(ui3icon3newwin(>
update'(messages( a,a&'(false( icon'(ui3icon3close(/>
</p:su-menu>
<p:separator />
<p:su-menu la-el'(Javigations( icon'(ui3icon3e&tlin2(>
<p:su-menu la-el'(#rime 7in2s(>
<p:menuitem value'(#rime( url'(http://www.prime.com.tr( />
<p:menuitem value'(#rime6aces( url'(http://www.primefaces.org( />
</p:su-menu>
<p:menuitem value'(5o-ile( url'(/mo-ile( />
</p:su-menu>
</p:tiered5enu>
AutoDisplay
1y de+au(tE ub"enu are di&(ayed 'hen "oue i over root "enuite"E et autoDi&(ay to +a(e to
reCuire a c(ic3 on root "enuite" to enab(e autoDi&(ay "ode.
<p:tiered5enu autoDisplay'(false(>
//content
</p:tiered5enu>
;erlay
9iered8enu can be &oitioned re(ative to a tri,,er co"&onentE +o((o'in, a"&(e attache a
tiered8enu to the button o that 'henever the button i c(ic3ed tiered8enu 'i(( be di&(ayed in an
over(ay ite(+.
466
<p:command=utton type'(-utton( value'(8how( id'(-tn( />
<p:tiered5enu autoDisplay'(false( trigger'(-tn( my'(left top( at'(left -ottom(>
//content
</p:tiered5enu>
$lient Side API
Wid,etN PrimeFaces.widget.Tiered-enu
a(i,n?@ B void A(i,n over(ay "enu 'ith tri,,er.
S+innin&
9iered8enu reide in a "ain container 'hich style and styleClass attribute a&&(y. #o((o'in, i the
)tyle #lass Applies
.uiB"enu .uiBtiered"enu *ontainer e(e"ent o+ "enu.
467
#.1#: 1oolbar
9oo(bar i a hori=onta( ,rou&in, co"&onent +or co""and and other content.
In%o
9a, tool&ar
*o"&onent *(a org.primefaces.component.tool&ar.Tool&ar
*o"&onent 9y&e org.primefaces.component.Tool&ar
Renderer 9y&e org.primefaces.component.Tool&arenderer
Renderer *(a org.primefaces.component.tool&ar.Tool&arenderer
Attributes
be rendered.
)ettin& Started with the 1oolbar
9oo(bar ha t'o &(aceho(der?(e+t and ri,ht@ that are de+ined 'ith +acet.
<p:tool-ar>
<f:facet name'(left(></f:facet>
<f:facet name'(right(></f:facet>
</p:tool-ar>
Any content can be &(aced inide too(bar.
468
<p:tool-ar>
<f:facet name'(left(>
<p:command=utton type'(push( value'(Jew( image'(ui3icon3document( />
<p:command=utton type'(push( value'(Open( image'(ui3icon3folder3open(/>
<span class'(ui3separator(>
<span class'(ui3icon ui3icon3grip3dotted3vertical( />
</span>
<p:command=utton type'(push( title'(8ave( image'(ui3icon3dis2(/>
<p:command=utton type'(push( title'(Delete( image'(ui3icon3trash(/>
<p:command=utton type'(push( title'(#rint( image'(ui3icon3print(/>
</f:facet>
<f:facet name'(right(>
<p:menu=utton value'(Javigate(>
<p:menuitem value'(4ome( url'(.( />
<p:menuitem value'(7ogout( url'(.( />
</p:menu=utton>
</f:facet>
</p:tool-ar>
S+innin&
9oo(bar reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i the (it
)tyle #lass Applies
.uiBtoo(bar 8ain container
.uiBtoo(bar .uiBe&arator Divider in a too(bar
.uiBtoo(barB,rou&B(e+t 6e+t too(barGrou& container
.uiBtoo(barB,rou&Bri,ht Ri,ht too(barGrou& container
469
#.1#1 1oolbar)roup CDeprecatedD
9oo(barGrou& i a he(&er co"&onent +or 9oo(bar co"&onent to de+ine &(aceho(der.
In%o
9a, tool&ar/roup
*o"&onent *(a org.primefaces.component.tool&ar.Tool&ar/roup
*o"&onent 9y&e org.primefaces.component.Tool&ar/roup
Attributes
be rendered.
a(i,n nu(( Strin, De+ine the a(i,n"ent 'ithin too(barE va(id va(ue
are left and right.
)ettin& Started with the 1oolbar)roup
See too(bar docu"entation +or "ore in+or"ation about ho' 9oo(bar Grou& i ued.
Deprecated
9oo(barGrou& co"&onent i de&recated and 'i(( be re"oved in a +uture re(eae. Ue left and right
+acet inide too(bar co"&onent intead.
470
#.1#2 1ooltip
9oo(ti& ,oe beyond the (e,acy ht"( tit(e attribute by &rovidin, cuto" e++ectE eventE ht"( content
and advance the"e u&&ort.
In%o
9a, tooltip
*o"&onent *(a org.primefaces.component.tooltip.Tooltip
*o"&onent 9y&e org.primefaces.component.Tooltip
Renderer 9y&e org.primefaces.component.Tooltipenderer
Renderer *(a org.primefaces.component.tooltip.Tooltipenderer
Attributes
rendered.
Strin,
ho'Event "oueover Strin, Event di&(ayin, the too(ti&.
ho'E++ect +ade Strin, E++ect to be ued +or di&(ayin,.
hideEvent "oueout Strin, Event hidin, the too(ti&.
hideE++ect +ade Strin, E++ect to be ued +or hidin,.
ho'De(ay 150 Inte,er De(ay ti"e to ho' too(ti& in "i((iecond.
471
hideDe(ay 0 Inte,er De(ay ti"e to hide too(ti& in "i((iecond.
+or nu(( Strin, *o"&onent to attach the too(ti&.
ty(e nu(( Strin, In(ine ty(e o+ the too(ti&.
ty(e*(a nu(( Strin, Sty(e c(a o+ the too(ti&.
,(oba(Se(ector nu(( Strin, /Cuery e(ector +or ,(oba( too(ti&E de+au(t to
IaENin&utENbuttonI.
trac38oue +a(e 1oo(ean 9oo(ti& &oition +o((o' &ointer on "oue"ove.
)ettin& started with the 1ooltip
9oo(ti& can be ued by attachin, it to a tar,et co"&onent. 9oo(ti& va(ue can a(o be retrieved +ro"
tar,et tit(eE o +o((o'in, are a"eK
<h:input8ecret id'(pwd( value'(./my=ean.password0( />
<p:tooltip for'(pwd( value'(Only num-ers(/>
<h:input8ecret id'(pwd( value'(./my=ean.password0( title'(Only num-ers(/>
<p:tooltip for'(pwd(/>
)lobal 1ooltip
Global tooltip binds to elements with title attributes. Ajax updates are supported as well, meaning if
target component is updated with ajax, tooltip can still bind. A ,(oba( too(ti& are "ore e++icient
ince on(y one intance o+ too(ti& i ued acro a(( too(ti& tar,etE it i u,,eted to be ued intead
o+ e0&(icit too(ti& un(e you have a cuto" cae e.,. di++erent o&tionE cuto" content.
<p:tooltip />
<p:input!e&t id'(focus( title'(!ooltip for an input(/>
<h:output7in2 id'(fade( value'(.( title'(!ooltip for a lin2(>
<h:output!e&t value'(6ade $ffect( />
</h:output7in2>
<p:command=utton value'(Kp( title'(Kp( />
I/1: Issue
Due to a bu,E IE10 a('ay di&(ay the tit(e te0t in a native &o&u& 'hen the e(e"ent receive +ocu
via tabbin, and t'o too(ti& "i,ht be di&(ayed at once. So(ution i to ue &athrou,h dataBtoo(ti&
attribute intead o+ tit(e.
472
<html &mlns'(http://www.w).org/*+++/&html(
&mlns:h'(http://&mlns.,cp.org/,sf/html(
&mlns:pt'(http://&mlns.,cp.org/,sf/passthrough(

<h:head></h:head>

<h:-ody>
<p:input!e&t pt:data3tooltip'(!itle here(/>
<p:input!e&t title'(1or2s fine e&cept ta--ed on I$*0(/>
</h:-ody>
</html>
/ents and /%%ects
A too(ti& i ho'n on "oueover event and hidden 'hen "oue i out by de+au(t. I+ you need to
chan,e thi behavior ue the ho'Event and hideEvent +eature. 9oo(ti& be(o' i di&(ayed 'hen the
in&ut ,et the +ocu and hidden 'ith onb(ur.
<h:input8ecret id'(pwd( value'(./my=ean.password0( />
<p:tooltip for'(pwd( value'(#assword must contain only num-ers(
show$vent'(focus( hide$vent'(-lur( show$ffect'(-lind( hide$ffect'(e&plode( />
Avai(ab(e o&tion +or e++ect areK blind6 bounce6 clip6 drop6 e$plode6 fold6 highlight6 puff6 pulsate6
scale6 sha"e6 si/e and slide.
(tml $ontent
Another &o'er+u( +eature o+ too(ti& i the abi(ity to di&(ay cuto" content a a too(ti&.
<h:output!e&t value'(#rime6aces 4ome( />
</h:output7in2>
<p:tooltip for'(ln2(>
<p:graphicImage value'(/images/primeLlogo.png( />
<h:output!e&t value'(@isit #rime6aces 4ome( />
</p:tooltip>
S+innin&
9oo(ti& ha on(y .ui1tooltip a a ty(e c(a and i ty(ed 'ith ,(oba( 3innin, e(ectorE ee "ain
3innin, ection +or "ore in+or"ation.
473
#.1## 1ree
9ree i i ued +or di&(ayin, hierarchica( data and creatin, ite navi,ation.
In%o
9a, tree
*o"&onent *(a org.primefaces.component.tree.Tree
*o"&onent 9y&e org.primefaces.component.Tree
Renderer 9y&e org.primefaces.component.Treeenderer
Renderer *(a org.primefaces.component.tree.Treeenderer
Attributes
rendered.
va(ue nu(( 7b/ect A 9ree<ode intance a the bac3in, "ode(.
var nu(( Strin, <a"e o+ the reCuetBco&ed variab(e thatO(( be ued
to re+er each treenode data.
dyna"ic +a(e 1oo(ean S&eci+ie the a/a0Qc(ient to,,(e8ode
cache true 1oo(ean S&eci+ie cachin, on dyna"ica((y (oaded node.
When et to true e0&anded node 'i(( be 3e&t in
"e"ory.
on<ode*(ic3 nu(( Strin, Aavacri&t event to &roce 'hen a tree node i
c(ic3ed.
e(ection nu(( 7b/ect 9ree<ode array to re+erence the e(ection.
474
ty(e nu(( Strin, Sty(e o+ the "ain container e(e"ent o+ tree
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain container e(e"ent o+ tree
e(ection8ode nu(( Strin, De+ine the e(ection8ode
hi,h(i,ht true 1oo(ean .i,h(i,ht node on hover 'hen e(ection i
enab(ed.
data3ey nu(( 7b/ect UniCue 3ey o+ the data &reented by node.
ani"ate +a(e 1oo(ean When enab(edE di&(ay (ide e++ect on to,,(e.
orientation vertica( Strin, 7rientation o+ (ayoutE vertical or hori/ontal.
&ro&a,ateSe(ectionU& true 1oo(ean De+ine u&'ard e(ection &ro&a,ation +or
chec3bo0 "ode.
&ro&a,ateSe(ectionDo'n true 1oo(ean De+ine do'n'ard e(ection &ro&a,ation +or
chec3bo0 "ode.
dra,,ab(e +a(e 1oo(ean 8a3e tree node dra,,ab(e.
dro&&ab(e +a(e 1oo(ean 8a3e tree dro&&ab(e.
dra,dro&Sco&e nu(( Strin, Sco&e 3ey to ,rou& a et o+ tree co"&onent +or
tran+errin, node uin, dra, and dro&.
dra,8ode e(+ Strin, De+ine &arentBchi(d re(ationhi& 'hen a node i
dra,,edE va(id va(ue are e(+ ?de+au(t@E &arent and
ancetor.
dro&Retrict none Strin, De+ine &arentBchi(d retriction 'hen a node i
dro&&ed va(id va(ue are none ?de+au(t@ and ib(in,.
reCuired +a(e 1oo(ean >a(idation contraint +or e(ection.
reCuired8ea,e nu(( Strin, 8ea,e +or reCuired e(ection va(idation.
)ettin& started with the 1ree
9ree i &o&u(ated 'ith a org.primefaces.model.Tree=ode intance 'hich corre&ond to the root.
<p:tree value'(./tree=ean.root0( var'(node(>
<p:treeJode>
<h:output!e&t value'(./node0(/>
</p:treeJode>
</p:tree>
475
pu-lic class !ree=ean /
private !reeJode root;
pu-lic !ree=ean9: /
root ' new !reeJode9(Coot(H null:;
!reeJode node0 ' new !reeJode9(Jode 0(H root:;
!reeJode node* ' new !reeJode9(Jode *(H root:;
!reeJode nodeA ' new !reeJode9(Jode A(H root:;
!reeJode node00 ' new !reeJode9(Jode 0.0(H node0:;
!reeJode node0* ' new !reeJode9(Jode 0.*(H node0:;
!reeJode node*0 ' new !reeJode9(Jode *.0(H node*:;
!reeJode node** ' new !reeJode9(Jode *.*(H node*:;
!reeJode node000 ' new !reeJode9(Jode 0.0.0(H node00:;
!reeJode node00* ' new !reeJode9(Jode 0.0.*(H node00:;
!reeJode node0*0 ' new !reeJode9(Jode 0.*.0(H node0*:;
!reeJode node*00 ' new !reeJode9(Jode *.0.0(H node*0:;
0
//getter of root
0
1ree0ode s pE1ree0ode
9ree<ode A!I i ued to create the node "ode( and conit o+ org.primefaces.model.Tree=ode
i n t ance E on t he ot her hand @p7tree=ode AB re&reent a co"&onent o+ ty&e
org.primefaces.component.tree.(*Tree=ode. Mou can bind a 9ree<ode to a &articu(ar &Ntree<ode
uin, the type na"e. Docu"ent 9ree e0a"&(e in u&co"in, ection de"ontrate a a"&(e ua,e.
1ree0ode API
9ree<ode ha a i"&(e A!I to ue 'hen bui(din, the bac3in, "ode(. #or e0a"&(e i+ you ca((
node.etE0&anded?true@ on a &articu(ar nodeE tree 'i(( render that node a e0&anded.
ty&e Strin, ty&e o+ the tree<ode na"eE de+au(t ty&e na"e i Ide+au(tI.
data 7b/ect Enca&u(ated data
chi(dren 6itS9ree<odeT 6it o+ chi(d node
&arent 9ree<ode !arent node
e0&anded 1oo(ean #(a, indicatin, 'hether the node i e0&anded or not
476
Dynamic 1ree
9ree i nonBdyna"ic by de+au(t and to,,(in, ha&&en on c(ientBide. In order to enab(e a/a0 to,,(in,
et dyna"ic ettin, to true.
<p:tree value'(./tree=ean.root0( var'(node( dynamic'(true(>
<p:treeJode>
</p:treeJode>
</p:tree>
=on1'ynamic7 When to,,(in, i et to c(ient a(( the treenode in "ode( are rendered to the c(ient
and tree i createdE thi "ode i uitab(e +or re(ative(y "a(( dataet and &rovide +at uer
interaction. 7n the otherhand it not uitab(e +or (ar,e data ince a(( the data i ent to the c(ient a(o
c(ient ide tree i tate(e.
'ynamic7 Dyna"ic "ode ue a/a0 to +etch the treenode +ro" erver ide on de"andE co"&ared to
the c(ient to,,(in,E dyna"ic "ode ha the advanta,e o+ dea(in, 'ith (ar,e data becaue on(y the
chi(d node o+ the root node i ent to the c(ient initia((y and 'ho(e tree i (a=i(y &o&u(ated. When a
node i e0&andedE tree on(y (oad the chi(dren o+ the &articu(ar e0&anded node and end to the c(ient
+or di&(ay.
Multiple 1ree0ode 1ypes
It a co""on reCuire"ent to di&(ay di++erent 9ree<ode ty&e 'ith a di++erent UI ?e, icon@.
Su&&oe youre uin, tree to viua(i=e a co"&any 'ith di++erent de&art"ent and di++erent
e"&(oyeeE or a docu"ent tree 'ith variou +o(derE +i(e each havin, a di++erent +or"at ?"uicE
video@. In order to o(ve thiE you can &(ace "ore than one @p7tree=ode AB co"&onent each havin,
a di++erent ty&e and ue that Ity&eI to bind 9ree<ode in your "ode(. #o((o'in, e0a"&(e
de"ontrate a docu"ent e0&(orer. .ere i the +ina( out&ut to achieveK
Docu"ent E0&(orer i i"&(e"ented 'ith +our di++erent @p7tree=ode AB co"&onent and additiona(
*SS 3innin, to viua(i=e e0&andedQc(oed +o(der icon.
477
<p:tree value'(./-ean.root0( var'(doc(>
<p:treeJode e&pandedIcon'(ui3icon ui3icon3folder3open(
collapsedIcon'(ui3icon ui3icon3folder3collapsed(>
<h:output!e&t value'(./doc.name0(/>
</p:treeJode>
<p:treeJode type'(document( icon'(ui3icon ui3icon3document(>
<h:output!e&t value'(./doc.name0( />
</p:treeJode>
<p:treeJode type'(picture( icon'(ui3icon ui3icon3image(>
</p:treeJode>
<p:treeJode type'(mp)( icon'(ui3icon ui3icon3video(>
</p:treeJode>
</p:tree>
478
pu-lic class =ean /
pu-lic =ean9: /
root ' new !reeJode9(root(H null:;
!reeJode documents ' new !reeJode9(Documents(H root:;
!reeJode pictures ' new !reeJode9(#ictures(H root:;
!reeJode music ' new !reeJode9(5usic(H root:;
!reeJode wor2 ' new !reeJode9(1or2(H documents:;
!reeJode primefaces ' new !reeJode9(#rime6aces(H documents:;
//Documents
!reeJode e&penses ' new !reeJode9(document(H ($&penses.doc(H wor2:;
!reeJode resume ' new !reeJode9(document(H (Cesume.doc(H wor2:;
!reeJode refdoc ' new !reeJode9(document(H (CefDoc.pages(H primefaces:;
//#ictures
!reeJode -arca ' new !reeJode9(picture(H (-arcelona.,pg(H pictures:;
!reeJode primelogo ' new !reeJode9(picture(H (logo.,pg(H pictures:;
!reeJode optimus ' new !reeJode9(picture(H (optimus.png(H pictures:;
//5usic
!reeJode tur2ish ' new !reeJode9(!ur2ish(H music:;
!reeJode cemTaraca ' new !reeJode9(em Taraca(H tur2ish:;
!reeJode er2inToray ' new !reeJode9($r2in Toray(H tur2ish:;
!reeJode mogollar ' new !reeJode9(5ogollar(H tur2ish:;
!reeJode nemalaca2 ' new !reeJode9(mp)(H (Jem <laca2 6ele2 =enim(H cemTaraca:;
!reeJode resimde2i ' new !reeJode9(mp)(H (Cesimde2i IoO "aslari(H cemTaraca:;
!reeJode copculer ' new !reeJode9(mp)(H (opculer(H er2inToray:;
!reeJode oyle-irgecer ' new !reeJode9(mp)(H (Oyle =ir Iecer(H er2inToray:;
!reeJode topra2ana ' new !reeJode9(mp)(H (!opra2 <na(H mogollar:;
!reeJode -isiyapmali ' new !reeJode9(mp)(H (=isi "apmali(H mogollar:;
0
//getter of root
0
Inte,ration bet'een a 9ree<ode and a &Ntree<ode i the ty&e attributeE +or e0a"&(e "uic +i(e in
docu"ent e0&(orer are re&reented uin, 9ree<ode 'ith ty&e I"&)IE there a(o a &Ntree<ode
co"&onent 'ith a"e ty&e I"&)I. 9hi reu(t in renderin, a(( "uic node uin, that &articu(ar
&Ntree<ode re&reentation 'hich di&(ay a note icon. Si"i(ar(y docu"ent and &icture have their
o'n &Ntree<ode re&reentation.
#o(der on the other hand have t'o tate 'hoe icon are de+ined by e$panded*con and
collapsed*con attribute.
A,a- .ehaior /ents
9ree &rovide variou a/a0 behavior event.
479
e0&and or,.&ri"e+ace.event.<odeE0&andEvent When a node i e0&anded.
co((a&e or,.&ri"e+ace.event.<ode*o((a&eEvent When a node i co((a&ed.
e(ect or,.&ri"e+ace.event.<odeSe(ectEvent When a node i e(ected.
co((a&e or,.&ri"e+ace.event.<odeUne(ectEvent When a node i une(ected.
#o((o'in, tree ha three (itenerK
<p:tree value'(./tree=ean.model0( dynamic'(true(>
<p:a,a& event'(select( listener'(./tree=ean.onJode8elect0( />
<p:a,a& event'(e&pand( listener'(./tree=ean.onJode$&pand0( />
<p:a,a& event'(collapse( listener'(./tree=ean.onJodeollapse0( />
...
</p:tree>
pu-lic void onJode8elect9Jode8elect$vent event: /
8tring node ' event.get!reeJode9:.getData9:.to8tring9:;
0
pu-lic void onJode$&pand9Jode$&pand$vent event: /
0
pu-lic void onJodeollapse9Jodeollapse$vent event: /
0
Event (itener are a(o ue+u( 'hen dea(in, 'ith hu,e a"ount o+ data. 9he idea +or i"&(e"entin,
uch a ue cae 'ou(d be &rovidin, on(y the root and chi(d node to the treeE ue event (itener to
,et the e(ected node and add ne' node to that &articu(ar tree at runti"e.
Selection
<ode e(ection i a bui(tBin +eature o+ tree and it u&&ort three di++erent "ode. Se(ection hou(d be
a 9ree<ode +or in,(e cae and an array o+ 9ree<ode +or "u(ti&(e and chec3bo0 caeE tree +ind
the e(ected node and ai,n the" to your e(ection "ode(.
singleN 7n(y one at a ti"e can be e(ectedE e(ection hou(d be a 9ree<ode re+erence.
multipleN 8u(ti&(e node can be e(ectedE e(ection hou(d be a 9ree<odeà re+erence.
chec"bo$N 8u(ti&(e e(ection i done 'ith chec3bo0 UIE e(ection hou(d be a 9ree<odeà re+erence.
480
<p:tree value'(./tree=ean.root0( var'(node(
selection5ode'(chec2-o&(
selection'(./tree=ean.selectedJodes0(>
<p:treeJode>
</p:treeJode>
</p:tree>
pu-lic class !ree=ean /
private !reeJodeQS selectedJodes;
pu-lic !ree=ean9: /
root ' new hec2-o&!reeJode9(Coot(H null:;
//populate nodes
0
0
9hat itE no' the chec3bo0 baed tree (oo3 (i3e be(o'. When the +or" i ub"itted 'ith a
co""and co"&onent (i3e a buttonE e(ected node 'i(( be &o&u(ated in e(ected<ode &ro&erty o+
9ree1ean. A chec3bo0 e(ection have a &ecia( hierarchyE ue Chec"bo$Tree=ode intead.
0ode $achin&
When cachin, i turned on by de+au(tE dyna"ica((y (oaded node 'i(( be 3e&t in "e"ory o reB
e0&andin, a node 'i(( not tri,,er a erver ide reCuet. In cae it et to +a(eE co((a&in, the node
'i(( re"ove the chi(dren and e0&andin, it (ater caue the chi(dren node to be +etched +ro" erver
a,ain.
(andlin& 0ode $lic+
I+ you need to e0ecute cuto" /avacri&t 'hen a treenode i c(ic3edE ue the on=odeClic" attribute.
Mour /avacri&t "ethod 'i(( be invo3ed 'ith &ain, the ht"( e(e"ent o+ the node and the c(ic3
event a &ara"eter. In cae you have data3ey de+inedE you can acce data3ey on c(ient ide by
uin, node.attr?!dataBdata3ey@ that re&reent the data re&reented by the bac3in, tree "ode(.
Dra&Drop
9ree node can be reordered 'ithin a in,(e tree and can even be tran+erred bet'een "u(ti&(e tree
uin, dra,dro&. #or a in,(e tree enab(e dra,,ab(e and dro&&ab(e o&tion.
481
<p:tree value'(./tree=ean.root0( var'(node( dragga-le'(true( droppa-le'(true(>
<p:treeJode>
</p:treeJode>
</p:tree>
#or "u(ti&(e treeE ue a co&e attribute to "atch the" and con+i,ure dra,dro& o&tion de&endin,
on your caeE +o((o'in, e0a"&(e ha % tree 'here one i the ource and other i the tar,et. 9ar,et
can a(o be reordered 'ithin ite(+.
<p:tree value'(./tree=ean.root*0( var'(node( dragga-le'(true( droppa-le'(false(
dragdrop8cope'(myscope(>
<p:treeJode>
</p:treeJode>
</p:tree>
<p:tree value'(./tree=ean.rootA0( var'(node( dragga-le'(true( droppa-le'(true(
dragdrop8cope'(myscope(>
<p:treeJode>
</p:treeJode>
</p:tree>
9'o additiona( o&tion e0it +or +urther con+i,urationE drag-ode de+ine the tar,et node that 'ou(d
be dro&&edE de+au(t va(ue i self and other va(ue are parent and ancestor. drop+estrict on the other
handE can retrict the dro& tar,et to be 'ithin the &arent by ettin, it to sibling.
(ori9ontal 1ree
De+au(t orientation o+ tree i vertica(E ettin, it to hori=onta( di&(ay node in an hori=onta( (ayout.
A(( +eature o+ vertica( tree e0ce&t dra,dro& i avai(ab(e +or hori=onta( tree a 'e((.
482
$onte-tMenu
9ree ha &ecia( inte,ration 'ith conte0t "enuE you can even "atch di++erent conte0t "enu 'ith
di++erent tree node uin, nodeType o&tion o+ conte0t "enu that "atche the tree node ty&e. <ote
that e(ection "ut be enab(ed in tree co"&onent +or conte0t "enu inte,ration.
<p:conte&t5enu for'(tree(>
<p:menuitem value'(@iew( update'(messages(
action7istener'(./-ean.view0( icon'(ui3icon3search( />
<p:menuitem value'(@iew( update'(tree(
action7istener'(./-ean.delete0( icon'(ui3icon3close( />
</p:conte&t5enu>
<p:tree id'(tree( value'(./-ean.root0( var'(node(
selection5ode'(single( selection'(./-ean.selectedJode0(>
<p:treeJode>
<h:output!e&t value'(./node0( />
</p:treeJode>
</p:tree>
S+innin&
9ree reide in a container e(e"ent 'hich style and styleClass o&tion a&&(y. #o((o'in, i the (it o+
)tyle #lass Applies
.uiBtree 8ain container
.uiBtreeBcontainer Root node container.
.uiBtreenode 9ree node
.uiBtreenodeBcontent 9ree node content
483
)tyle #lass Applies
.uiBtreenodeBicon 9ree node icon
.uiBtreeBto,,(er 9o,,(e icon
.uiBtreenodeB(abe( 9ree node (abe(
.uiBtreenodeB&arent <ode 'ith chi(dren
.uiBtreenodeB(ea+ <ode 'ithout chi(dren
484
#.1#' 1ree0ode
9ree<ode i ued 'ith 9ree co"&onent to re&reent a node in tree.
In%o
9a, treeNode
*o"&onent *(a org.primefaces.component.tree.-.TreeNode
*o"&onent 9y&e org.primefaces.component.-.TreeNode
Attributes
rendered.
ty&e de+au(t Strin, 9y&e o+ the tree node
ty(e*(a nu(( Strin, Sty(e c(a to a&&(y a &articu(ar tree node ty&e
icon nu(( Strin, Icon o+ the node.
e0&andedIcon nu(( Strin, E0&anded icon o+ the node.
co((a&edIcon nu(( Strin, *o((a&ed icon o+ the node.
)ettin& started with the 1ree0ode
9ree<ode i ued by 9ree and 9ree9ab(e co"&onentE re+er to ection o+ thee co"&onent +or
"ore in+or"ation.
485
#.1#3 1ree1able
9reetab(e i i ued +or di&(ayin, hierarchica( data in tabu(ar +or"at.
In%o
9a, treeTa&le
*o"&onent *(a org.primefaces.component.treeta&le.TreeTa&le
*o"&onent 9y&e org.primefaces.component.TreeTa&le
Renderer 9y&e org.primefaces.component.TreeTa&leenderer
Renderer *(a org.primefaces.component.treeta&le.TreeTa&leenderer
Attributes
not be rendered.
va(ue nu(( 7b/ect A 9ree<ode intance a the bac3in, "ode(.
re+er each treenode.
486
e(ection nu(( 7b/ect Se(ection re+erence.
e(ection8ode nu(( Strin, 9y&e o+ e(ection "ode.
cro((ab(e +a(e 1oo(ean Whether or not the data hou(d be cro((ab(e.
cro((.ei,ht nu(( Inte,er .ei,ht o+ cro((ab(e data.
cro((Width nu(( Inte,er Width o+ cro((ab(e data.
tab(eSty(e nu(( Strin, In(ine ty(e o+ the tab(e e(e"ent.
tab(eSty(e*(a nu(( Strin, Sty(e c(a o+ the tab(e e(e"ent.
e"&ty8ea,e <o
record
+ound
Strin, 9e0t to di&(ay 'hen there i no data to di&(ay.
rei=ab(e*o(u"n +a(e 1oo(ean De+ine i+ co(u" can be rei=ed or not.
ro'Sty(e*(a nu(( Strin, Sty(e c(a +or each ro'.
(iveRei=e +a(e 1oo(ean *o(u"n are rei=ed (ive in thi "ode 'ithout
uin, a rei=e he(&er.
reCuired +a(e 1oo(ean >a(idation contraint +or e(ection.
reCuired8ea,e nu(( Strin, 8ea,e +or reCuired e(ection va(idation.
ort1y nu(( >a(ueE0&r E0&reion +or de+au(t ortin,.
ort7rder acendin, Strin, De+ine de+au(t ortin, order.
ort#unction nu(( 8ethodE0&r *uto" &(u,,ab(e ort#unction +or de+au(t
ortin,.
nativeE(e"ent +a(e 1oo(ean In native "odeE treetab(e ue native
chec3bo0e.
data6oca(e nu(( 7b/ect 6oca(e to be ued in +eature uch a ortin,E
de+au(t to vie' (oca(e.
caeSenitiveSort +a(e 1oo(ean *ae enitivity +or ortin,E inenitive by
de+au(t.
)ettin& started with the 1ree1able
Si"i(ar to the 9reeE 9ree9ab(e i &o&u(ated 'ith an org.primefaces.model.Tree=ode intance that
corre&ond to the root node. 9ree<ode A!I ha a hierarchica( data tructure and re&reent the data
to be &o&u(ated in tree. #or an e0a"&(eE "ode( to be di&(ayed i a co((ection o+ docu"ent i"i(ar
a in tree ection.
487
pu-lic class Document /
private 8tring siOe;
private 8tring type;
//gettersH setters
0
<p:tree!a-le value'(./-ean.root0( var'(document(>
<p:column>
Jame
</f:facet>
<h:output!e&t value'(./document.name0( />
</p:column>
//more columns
</p:tree!a-le>
Selection
<ode e(ection i a bui(tBin +eature o+ tree and it u&&ort t'o di++erent "ode. Se(ection hou(d be a
9ree<ode +or in,(e cae and an array o+ 9ree<ode +or "u(ti&(e caeE tree +ind the e(ected node
and ai,n the" to your e(ection "ode(.
singleN 7n(y one at a ti"e can be e(ectedE e(ection hou(d be a 9ree<ode re+erence.
multiple or chec"bo$N 8u(ti&(e node can be e(ectedE e(ection hou(d be a 9ree<odeà re+erence.
A chec3bo0 e(ection have a &ecia( hierarchyE ue Chec"bo$Tree=ode in chec3bo0 "ode.
A,a- .ehaior /ents
9ree9ab(e &rovide variou a/a0 behavior event to re&ond uer action.
e0&and or,.&ri"e+ace.event.<odeE0&andEvent When a node i e0&anded.
co((a&e or,.&ri"e+ace.event.<ode*o((a&eEvent When a node i co((a&ed.
e(ect or,.&ri"e+ace.event.<odeSe(ectEvent When a node i e(ected.
une(ect or,.&ri"e+ace.event.<odeUne(ectEvent When a node i une(ected.
co(Rei=e or,.&ri"e+ace.event.*o(u"nRei=eEvent When a co(u"n i rei=ed.
$onte-tMenu
9ree9ab(e ha &ecia( inte,ration 'ith conte0t "enuE you can even "atch di++erent conte0t "enu
'ith di++erent tree node uin, nodeType o&tion o+ conte0t "enu that "atche the tree node ty&e.
488
Scrollin&
Scro((ab(e 9ree9ab(e i"&(e"entation i a"e a Data9ab(e Scro((ab(eE re+er to cro((in, &art in
Data9ab(e ection +or detai(ed in+or"ation.
Sortin&
Sortin, i enab(ed by ettin, sort)y e0&reion at co(u"n (eve(.
<p:tree!a-le value'(./-ean.root0( var'(document(>
<p:column sort=y'(./document.name0(>
<h:output!e&t value'(./document.name0( />
</p:column>
//more columns
</p:tree!a-le>
In cae youOd (i3e to di&(ay tree9ab(e a orted on &a,e (oad ue ort1y attribute o+ tree9ab(eE
o&tiona( sort,rder and sortFunction attribute are &rovided to de+ine the de+au(t ort order
?acendin, or decindin,@ and a /ava "ethod to do the actua( ortin, re&ective(y. Re+er to datatab(e
ortin, ection +or an e0a"&(e ua,e o+ sortFunction.
S+innin&
9ree9ab(e content reide in a container e(e"ent 'hich ty(e and ty(e*(a attribute a&&(y.
#lass Applies
.uiBtreetab(e 8ain container e(e"ent.
.uiBtreetab(eBheader .eader o+ treetab(e.
.uiBtreetab(eBdata 1ody e(e"ent o+ the tab(e containin, data
489
#.1#5 Watermar+
Water"ar3 di&(ay a hint on an in&ut +ie(d.
In%o
9a, 0atermar,
*o"&onent *(a org.primefaces.component.0atermar,.1atermar,
*o"&onent 9y&e org.primefaces.component.1atermar,
Renderer 9y&e org.primefaces.component.1atermar,enderer
Renderer *(a org.primefaces.component.0atermar,.1atermar,enderer
Attributes
be rendered.
va(ue nu(( 7b/ect 9e0t o+ 'ater"ar3.
+or nu(( Strin, *o"&onent to attach the 'ater"ar3
)ettin& started with Watermar+
Water"ar3 reCuire a tar,et o+ the in&ut co"&onent. In cae you donOt need to u&&ort (e,acy
bro'erE &re+er &(aceho(der attribute o+ in&ut co"&onent over 'ater"ar3.
<h:input!e&t id'(t&t( value'(./-ean.searchTeyword0( />
<p:watermar2 for'(t&t( value'(8earch with a 2eyword( />
490
Form Submissions
Water"ar3 i et a the te0t o+ an in&ut +ie(d 'hich hou(dnt be ent to the erver 'hen an
enc(oin, +or i ub"itted. 9hi 'ou(d reu(t in u&datin, bean &ro&ertie 'ith 'ater"ar3 va(ue.
Water"ar3 co"&onent i c(ever enou,h to hand(e thi caeE by de+au(t in nonBa/a0 +or"
ub"iionE 'ater"ar3 are c(eared. .o'ever a/a0 ub"iion reCuire a (itt(e "anua( e++ort.
!(eae note that thi on(y a&&(ie to (e,acy bro'erE a 'ater"ar3 ue .9865 &(aceho(der o&tion
'hen avai(ab(e.
<h:input!e&t id'(t&t( value'(./-ean.searchTeyword0( />
<p:watermar2 for'(t&t( value'(8earch with a 2eyword( />
<p:command=utton value'(8u-mit( onclic2'(#rime6aces.clean1atermar2s9:(
oncomplete'(#rime6aces.show1atermar2s9:( />
S+innin&
#or bro'er that do not u&&ort &(aceho(derE there on(y one c ty(e c(a a&&(yin, 'ater"ar3
'hich i !.ui1watermar"E you can override thi c(a to brin, in your o'n ty(e.
491
#.1#6 Wi9ard
Wi=ard &rovide an a/a0 enhanced UI to i"&(e"ent a 'or3+(o' eai(y in a in,(e &a,e. Wi=ard
conit o+ evera( chi(d tab co"&onent 'here each tab re&reent a te& in the &roce.
In%o
9a, 0i3ard
*o"&onent *(a org.primefaces.component.0i3ard.1i3ard
*o"&onent 9y&e org.primefaces.component.1i3ard
Renderer 9y&e org.primefaces.component.1i3ardenderer
Renderer *(a org.primefaces.component.0i3ard.1i3ardenderer
Attributes
te& 0 Strin, Id o+ the current te& in +(o'
ty(e nu(( Strin, Sty(e o+ the "ain 'i=ard container e(e"ent.
ty(e*(a nu(( Strin, Sty(e c(a o+ the "ain 'i=ard container e(e"ent.
+(o'6itener nu(( 8ethodE0&r Server ide (itener to invo3e 'hen 'i=ard atte"&t to ,o
+or'ard or bac3.
ho'<av1ar true 1oo(ean S&eci+ie viibi(ity o+ de+au(t navi,ator arro'.
ho'Ste&Statu true 1oo(ean S&eci+ie viibi(ity o+ de+au(t te& tit(e bar.
492
onbac3 nu(( Strin, Aavacri&t event hand(er to be invo3ed 'hen +(o' ,oe
bac3.
onne0t nu(( Strin, Aavacri&t event hand(er to be invo3ed 'hen +(o' ,oe
+or'ard.
ne0t6abe( nu(( Strin, 6abe( o+ ne0t navi,ation button.
bac36abe( nu(( Strin, 6abe( o+ bac3 navi,ation button.
)ettin& Started with Wi9ard
Each te& in the +(o' i re&reented 'ith a tab. A an e0a"&(e +o((o'in, 'i=ard i ued to create a
ne' uer in a tota( o+ - te& 'here (at te& i +or con+ir"ation o+ the in+or"ation &rovided in +irt
) te&. 9o be,in 'ith create your bac3in, beanE it i"&ortant that the bean (ive acro "u(ti&(e
reCuet o avoid a reCuet co&e bean. 7&ti"a( co&e +or 'i=ard i vie'Sco&e.
pu-lic class Kser1iOard /
private Kser user ' new Kser9:;
pu-lic Kser getKser9: /
return user;
0
pu-lic void setKser9Kser user: /
this.user ' user;
0
pu-lic void save9<ction$vent action$vent: /
//#ersist user
6aces5essage msg ' new 6aces5essage9(8uccessful(H
(1elcome :( > user.get6irstname9::;
0
0
(ser i a i"&(e &o/o 'ith &ro&ertie uch a +irtna"eE (atna"eE e"ai( and etc. #o((o'in, 'i=ard
reCuire ) te& to ,et the uer dataK !erona( Detai(E Addre Detai( and *ontact Detai(. <ote
that (at tab contain readBon(y data +or con+ir"ation and the ub"it button.
493
<h:form>
<p:wiOard>
<p:ta- id'(personal(>
<p:panel header'(#ersonal Details(>
<h:messages errorlass'(error(/>
<h:output!e&t value'(6irstname: W( />
<h:input!e&t value'(./user1iOard.user.firstname0( reBuired'(true(/>
<h:output!e&t value'(7astname: W( />
<h:input!e&t value'(./user1iOard.user.lastname0( reBuired'(true(/>
<h:output!e&t value'(<ge: ( />
<h:input!e&t value'(./user1iOard.user.age0( />
</h:panelIrid>
</p:panel>
</p:ta->
<p:ta- id'(address(>
<p:panel header'(<dress Details(>
<h:panelIrid columns'(A( columnlasses'(la-elH value(>
<h:output!e&t value'(8treet: ( />
<h:input!e&t value'(./user1iOard.user.street0( />
<h:output!e&t value'(#ostal ode: ( />
<h:input!e&t value'(./user1iOard.user.postalode0( />
<h:output!e&t value'(ity: ( />
<h:input!e&t value'(./user1iOard.user.city0( />
</h:panelIrid>
</p:panel>
</p:ta->
<p:ta- id'(contact(>
<p:panel header'(ontact Information(>
<h:output!e&t value'($mail: W( />
<h:input!e&t value'(./user1iOard.user.email0( reBuired'(true(/>
<h:output!e&t value'(#hone: ( />
<h:input!e&t value'(./user1iOard.user.phone0(/>
<h:output!e&t value'(<dditional Info: ( />
<h:input!e&t value'(./user1iOard.user.info0(/>
</h:panelIrid>
</p:panel>
</p:ta->
494
<p:ta- id'(confirm(>
<p:panel header'(onfirmation(>
<h:panelIrid id'(confirmation( columns'(U(>
<h:output!e&t value'(6irstname: ( />
<h:output!e&t value'(./user1iOard.user.firstname0(/>
<h:output!e&t value'(7astname: ( />
<h:output!e&t value'(./user1iOard.user.lastname0(/>
<h:output!e&t value'(<ge: ( />
<h:output!e&t value'(./user1iOard.user.age0( />
<h:output!e&t value'(8treet: ( />
<h:output!e&t value'(./user1iOard.user.street0( />
<h:output!e&t value'(#ostal ode: ( />
<h:output!e&t value'(./user1iOard.user.postalode0(/>
<h:output!e&t value'(ity: ( />
<h:output!e&t value'(./user1iOard.user.city0(/>
<h:output!e&t value'($mail: ( />
<h:output!e&t value'(./user1iOard.user.email0( />
<h:output!e&t value'(#hone ( />
<h:output!e&t value'(./user1iOard.user.phone0(/>
<h:output!e&t value'(Info: ( />
<h:output!e&t value'(./user1iOard.user.info0(/>
<h:output!e&t />
<h:output!e&t />
</h:panelIrid>
<p:command=utton value'(8u-mit( action7istener'(./user1iOard.save0( />
</p:panel>
</p:ta->
</p:wiOard>
</h:form>
A!A= and Partial <alidations
S'itchin, bet'een te& i baed on a/a0E "eanin, each te& i (oaded dyna"ica((y 'ith a/a0.
!artia( va(idation i a(o bui(tBinE by thi 'ay 'hen you c(ic3 ne0tE on(y the current te& i va(idatedE
i+ the current te& i va(idE ne0t tab content are (oaded 'ith a/a0. >a(idation are not e0ecuted
'hen +(o' ,oe bac3.
0ai&ations
Wi=ard &rovide t'o icon to interact 'ithK ne0t and &rev. !(eae ee the 3innin, 'i=ard ection to
3no' "ore about ho' to chan,e the (oo3 and +ee( o+ a 'i=ard.
495
$ustom 4I
1y de+au(t 'i=ard di&(ay ri,ht and (e+t arro' to navi,ate bet'een te&E i+ you need to co"e u&
'ith your o'n UIE et show=av)ar to +a(e and ue the &rovided the c(ient ide a&i.
<p:wiOard showJav=ar'(false( widget@ar'(wiO(>
...
</p:wiOard>
<h:output7in2 value'(.( onclic2'(#69?wiO?:.ne&t9:;(>Je&t</h:output7in2>
<h:output7in2 value'(.( onclic2'(#69?wiO?:.-ac29:;(>=ac2</h:output7in2>
Flow*istener
I+ youd (i3e ,et noti+ied on erver ide 'hen 'i=ard atte"&t to ,o bac3 or +or'ardE de+ine a
+(o'6itener.
<p:wiOard flow7istener'(./user1iOard.handle6low0(>
...
</p:wiOard>
pu-lic 8tring handle6low96low$vent event: /
8tring current8tepId ' event.geturrent8tep9:;
8tring step!oIo ' event.getJe&t8tep9:;
if9s2ip:
return (confirm(;
else
return event.getJe&t8tep9:;
0
Ste& here are i"&(y the id o+ tabE by uin, a +(o'6itener you can decide 'hich te& to di&(ay
ne0t o 'i=ard doe not need to be (inear a('ay. I+ you need to u&date other co"&onent?@ on &a,e
'ithin a +(o'E ue +equestConte$t.updateString client*d! a&i.
Wi=ard i eCui&&ed 'ith onbac3 and onne0t attributeE in cae you need to e0ecute cuto"
/avacri&t a+ter 'i=ard ,oe bac3 or +orth. Mou /ut need to &rovide the na"e o+ /avacri&t +unction
a the va(ue o+ thee attribute.
<p:wiOard onne&t'(alert9!Je&t:( on-ac2'(alert9!=ac2:(>
...
</p:wiOard>
$lient Side API
Wid,etN PrimeFaces.widget.5i/ard
496
ne0t?@ B void !roceed to ne0t te&.
bac3?@ B void Goe bac3 in +(o'.
,etSte&Inde0?@ B <u"ber Return the inde0 o+ current te&.
ho'<e0t<av?@ B void Sho' ne0t button.
hide<e0t<av?@ B void .ide ne0t button.
ho'1ac3<av?@ B void Sho' bac3 button.
hide1ac3<av?@ B void .ide bac3 button.
S+innin&
Wi=ard reide in a container e(e"ent that style and styleClass attribute a&&(y. #o((o'in, i the (it
o+ tructura( c c(ae.
)elector Applies
.uiB'i=ard 8ain container e(e"ent.
.uiB'i=ardBcontent *ontainer e(e"ent o+ content.
.uiB'i=ardBte&Btit(e *ontainer o+ te& tit(e.
.uiB'i=ardBte&Btit(e Each te& tit(e.
.uiB'i=ardBnavbar *ontainer o+ navi,ation contro(.
.uiB'i=ardBnavBbac3 1ac3 navi,ation contro(.
.uiB'i=ardBnavBne0t #or'ard navi,ation contro(.
497
'. Partial "enderin& and Processin&
!ri"e#ace &rovide a &artia( renderin, and vie' &rocein, +eature baed on tandard AS# % A!I
to enab(e chooin, 'hat to &roce in AS# (i+ecy(e and 'hat to render in the end 'ith a/a0.
'.1 Partial "enderin&
In addition to co"&onent (i3e auto*o"&(eteE datatab(eE (ider 'ith bui(tBin a/a0 ca&abi(itieE
!ri"e#ace a(o &rovide a ,eneric !!R ?!artia( !a,e Renderin,@ "echani" to u&date AS#
co"&onent 'ith a/a0. Severa( co"&onent are eCui&&ed 'ith the co""on !!R attribute ?e.,.
u&dateE &roceE ontartE onco"&(ete@.
'.1.1 In%rastructure
!ri"e#ace A/a0 #ra"e'or3 i baed on tandard erver ide A!I o+ AS# %. 9here are no additiona(
art+act (i3e cuto" A/a0>ie'RootE A/a0State8ana,erE A/a0>ie'.and(erE Serv(et #i(terE
.t"(!arerE !hae6itener and o on. !ri"e#ace ai" to 3ee& it c(eanE +at and (i,ht'ei,ht.
7n c(ient ide rather than uin, c(ient ide A!I i"&(e"entation o+ AS# i"&(e"entation (i3e
8o/arra and 8y#aceE !ri"e#ace cri&t are baed on the "ot &o&u(ar /avacri&t (ibraryK /Duery
'hich i +ar "ore tetedE tab(e re,ardin, a/a0E do" hand(in,E do" tree traverin, than a AS#
i"&(e"entation cri&t.
'.1.2 4sin& IDs
)ettin& Started
When uin, !!R you need to &eci+y 'hich co"&onent?@ to u&date 'ith a/a0. I+ the co"&onent
that tri,,er !!R reCuet i at the a"e na"in,container ?e,. +or"@ 'ith the co"&onent?@ it
renderE you can ue the erver id direct(y. In thi ection a(thou,h 'e(( be uin, co""and1uttonE
a"e a&&(ie to every co"&onent that ca&ab(e o+ !!R uch a co""and6in3E &o((E
re"ote*o""and and etc.
<h:form>
<p:command=utton update'(display( />
<h:output!e&t id'(display( value'(./-ean.value0(/>
</h:form>
PrependId
Settin, &re&endId ettin, o+ a +or" ha no e++ect on ho' !!R i ued.
<h:form prependId'(false(>
<p:command=utton update'(display( />
</h:form>
498
$lientId
It i a(o &oib(e to de+ine the c(ient id o+ the co"&onent to u&date.
<h:form id'(myform(>
<p:command=utton update'(myform:display( />
</h:form>
Di%%erent 0amin&$ontainers
I+ your &a,e ha di++erent na"in, container ?e.,. t'o +or"@E you a(o need to add the container id
to earch e0&reion o that !!R can hand(e reCuet that are tri,,ered inide a na"in,container
that u&date another na"in,container. #o((o'in, i the u,,eted 'ay uin, e&arator char a a
&re+i0E note that thi ue a"e earch a(,orith" a tandard AS# % i"&(e"entationK
<h:form id'(form*(>
<p:command=utton update'(:formA:display( />
</h:form>
<h:form id'(formA(>
</h:form>
!(eae read find#omponent a(,orith" decribed in (in3 be(o' ued by both AS# core and
!ri"e#ace to +u((y undertand ho' co"&onent re+erencin, 'or3.
http://docs.oracle.com/,avaee/U/api/,ava&/faces/component/KIomponent.html
AS# hN+or"E datatab(eE co"&oite co"&onent are na"in, containerE in addition tab>ie'E
accordion!ane(E data9ab(eE dataGridE data6itE caroue(E ,a((eriaE rin,E heet and ub9ab(e are
!ri"e#ace co"&onent that i"&(e"ent <a"in,*ontainer.
Multiple $omponents
8u(ti&(e co"&onent to u&date can be &eci+ied 'ith &rovidin, a (it o+ id e&arated by a co""aE
'hite&ace or even both.
<h:form>
<p:command=utton update'(display*HdisplayA( />
<p:command=utton update'(display* displayA( />
<h:output!e&t id'(display*( value'(./-ean.value*0(/>
<h:output!e&t id'(displayA( value'(./-ean.valueA0(/>
</h:form>
499
'.1.# 0oti%yin& 4sers
a/a0Statu i the co"&onent to noti+y the uer about the tatu o+ glo&al a/a0 reCuet. See the
a/a0Statu ection to ,et "ore in+or"ation about the co"&onent.
)lobal s 0on>)lobal
1y de+au(t a/a0 reCuet are ,(oba(E "eanin, i+ there i an a/a0Statu co"&onent &reent on &a,eE it
i tri,,ered.
I+ you 'ant to do a Ii(entI reCuet not to tri,,er a/a0Statu inteadE et ,(oba( to +a(e. An e0a"&(e
'ith co""and1utton 'ou(d beK
<p:command=utton value'(8ilent( glo-al'(false( />
<p:command=utton value'(Jotify( glo-al'(true( />
'.1.' .itsAPieces
PrimeFaces A,a- !aascript API
See the /avacri&t ection to (earn "ore about the !ri"e#ace Aavacri&t A/a0 A!I.
500
'.2 Partial Processin&
In !artia( !a,e Renderin,E on(y &eci+ied co"&onent are renderedE i"i(ar(y in !artia( !rocein,
on(y de+ined co"&onent are &roceed. !rocein, "ean e0ecutin, A&&(y ReCuet >a(ueE
!roce >a(idationE U&date 8ode( and Invo3e A&&(ication AS# (i+ecyc(e &hae on(y on de+ined
co"&onent.
9hi +eature i a i"&(e but &o'er+u( enou,h to do ,rou& va(idationE avoidin, va(idatin, un'anted
co"&onentE e(i"inatin, need o+ uin, i""ediate and "any "ore ue cae. >ariou co"&onent
uch a co""and1uttonE co""and6in3 are eCui&&ed 'ith &roce attributeE in e0a"&(e 'e(( be
uin, co""and1utton.
'.2.1 Partial <alidation
A co""on ue cae o+ &artia( &roce i doin, &artia( va(idationE u&&oe you have a i"&(e
contact +or" 'ith t'o dro&do'n co"&onent +or e(ectin, city and uburbE a(o there an in&ut9e0t
'hich i reCuired. When city i e(ectedE re(ated uburb o+ the e(ected city i &o&u(ated in uburb
dro&do'n.
<h:form>
<h:selectOne5enu id'(cities( value'(./-ean.city0(>
<f:selectItems value'(./-ean.cityhoices0( />
<p:a,a& listener'(./-ean.populate8u-ur-s0( update'(su-ur-s(
process'(Zall(/>
</h:selectOne5enu>
<h:selectOne5enu id'(su-ur-s( value'(./-ean.su-ur-0(>
<f:selectItems value'(./-ean.su-ur-hoices0( />
</h:selectOne5enu>
<h:input!e&t value'(./-ean.email0( reBuired'(true(/>
</h:form>
When the city dro&do'n i chan,ed an a/a0 reCuet i ent to e0ecute &o&u(ateSuburb "ethod
'hich &o&u(ate uburb*hoice and +ina((y u&date the uburb dro&do'n. !rob(e" i
&o&u(ateSuburb "ethod 'i(( not be e0ecuted a (i+ecyc(e 'i(( to& a+ter &roce va(idation &hae
to /u"& render re&one a e"ai( in&ut i not &rovided. Reaon i &Na/a0 ha ba(( a the va(ue
tatin, to &roce every co"&onent on &a,e but there i no need to &roce the in&ut9e0t.
9he o(ution i to de+ine 'hat to &roce in &Na/a0. A 'ere /ut "a3in, a city chan,e reCuetE on(y
&rocein, that hou(d ha&&en i citie dro&do'n.
501
<h:form>
<h:selectOne5enu id'(cities( value'(./-ean.city0(>
<f:selectItems value'(./-ean.cityhoices0( />
<p:a,a& action7istener'(./-ean.populate8u-ur-s0(
event'(change( update'(su-ur-s( process'(Zthis(/>
</h:selectOne5enu>
<h:selectOne5enu id'(su-ur-s( value'(./-ean.su-ur-0(>
<f:selectItems value'(./-ean.su-ur-hoices0( />
</h:selectOne5enu>
<h:input!e&t value'(./-ean.email0( reBuired'(true(/>
</h:form>
9hat i itE no' &o&u(ateSuburb "ethod 'i(( be ca((ed and uburb (it 'i(( be &o&u(ated. <ote that
de+au(t va(ue +or &roce o&tion i bthi a(ready +or &Na/a0 a tated in A/a01ehavior
docu"entationE it i e0&(icit(y de+ined here to ,ive a better undertandin, o+ ho' &artia( &rocein,
'or3.
'.2.2 4sin& Ids
!artia( !roce ue the a"e techniCue a&&(ied in &artia( u&date to &eci+y co"&onent identi+ier
to &roce.
502
'.# Search /-pression Framewor+
*ore AS# co"&onent re+erencin, i baed on co"&onent identi+ier on(y 'ith baic 3ey'ord
u&&ort. !ri"e#ace Search E0&reion #ra"e'or3 ?SE#@ &rovide both erver ide and c(ient ide
e0tenion to "a3e it eaier to re+erence co"&onent. SE# i uti(i=ed in &artia( u&dateE &roce and
'henever a co"&onent re+erence another co"&onent.
'.#.1 @eywords
;ey'ord are the eaier 'ay to re+erence co"&onentE they reo(ve to id o that i+ an id chan,eE
the re+erence doe not need to chan,e. *ore AS# &rovide a cou&(e o+ 3ey'ord and !ri"e#ace
&rovide "ore a(on, 'ith co"&oite e0&reion u&&ort.
5ey0ord Type Description
bthi Standard *urrent co"&onent.
ba(( Standard Who(e vie'.
b+or" Standard *(oet ancetor +or" o+ current co"&onent.
bnone Standard <o co"&onent.
bna"in,container !ri"e#ace *(oet ancetor na"in, container o+ current co"&onent.
b&arent !ri"e#ace !arent o+ the current co"&onent.
bco"&oite !ri"e#ace *(oet co"&oite co"&onent ancetor.
bchi(d?n@ !ri"e#ace nth chi(d.
b&reviou !ri"e#ace !reviou ib(in,.
bne0t !ri"e#ace <e0t ib(in,.
b'id,et>ar?na"e@ !ri"e#ace *o"&onent 'ith ,iven 'id,et>ar.
*onider the +o((o'in, cae 'here id are ued +or re+erencin,K
<h:form id'(form*(>
<p:command=utton id'(-tn( update'(form*( process'(-tn( />
<h:output!e&t value'(./-ean.value0(/>
</h:form>
Uin, 3ey'ordE a"e can be 'ritten aK
<h:form id'(form*(>
<p:command=utton id'(-tn( update'(Zform( process'(Zthis( />
<h:output!e&t value'(./-ean.value0(/>
</h:form>
503
$omposite /-pressions
8u(ti&(e 3ey'ord can be co"bined in a in,(e e0&reion uin, co(onK
G b+or"Nb&arent
G bco"&oiteN"ybuttonid
G bthiNb&arentNb&arent
G b+or"Nbchi(d?%@
4sa&e Scenarios
SE# i not /ut at &artia( &roce and u&dateE they are a(o avai(ab(e 'henever a co"&onent i
re+erencin, another.
<h:form>
<p:command=utton id'(dyna=utton( value'(8how( type'(-utton( />
<p:menu overlay'(true( trigger'(Zparent:dyna=utton(>
//items
</p:menu>
</h:form>
'.#.2 PrimeFaces Selectors CPFSD
!#S inte,rate /Duery Se(ector A!I 'ith AS# co"&onent re+erencin, "ode( o that re+erencin, can
be done uin, /Duery Se(ector A!I intead o+ core id baed AS# "ode(. 1et 'ay to e0&(ain the
&o'er o+ !#S i e0a"&(eK
U&date a(( +or"
update'(Z9form:(
U&date +irt +or"
update'(Z9form:first:(
U&date a(( co"&onent that ha ty(e*(a na"ed "yty(e
update'(Z9.mystyle:(
U&date and &roce a(( in&ut
update'(Z9:input:( process'(Z9:input:(
504
U&date a(( datatab(e
update'(Z9.ui3datata-le:(
!roce in&ut co"&onent inide any &ane( and u&date a(( &ane(
process'(Z9.ui3panel :input:( update'(Z9.ui3panel:(
!roce in&ut co"&onent but not e(ect co"&onent
process'(Z9:input:not9select::(
U&date in&ut co"&onent that are diab(ed
update'(Z9:input:disa-led:(
!#S can be ued 'ith other re+erencin, a&&roache a 'e((K
update'(compId :form:compId Z9:input: Zparent:Zchild9A:(
<h:form>
<p:command=utton id'(dyna=utton( value'(8how( type'(-utton( stylelass'(-tn(/>
<p:menu overlay'(true( trigger'(Z9.-tn:(>
//items
</p:menu>
</h:form>
!#S &rovide an a(ternativeE +(e0ib(eE ,rou&in, baed a&&roach to re+erence co"&onent to &artia((y
&roce and u&date. 9here i (e *!U erver (oad co"&ared to re,u(ar re+erencin, becaue AS#
co"&onent tree i not travered on erver ide to +ind a co"&onent and +i,ure out the c(ient id a
!#S i i"&(e"ented on c(ient ide by (oo3in, at do" tree. Another advanta,e i avoidin, na"in,
container (i"itationE /ut re"e"ber the ti"e youve +aced 'ith cannot +ind co"&onent e0ce&tion
ince the co"&onent you are (oo3in, +or i in a di++erent na"in, container (i3e a +or" or a
datatab(e. !#S can he(& you out in tric3y ituation by +o((o'in, /Duery 'rite (e do "ore ty(e.
#or !#S to +unction &ro&er(y and not to "i any co"&onentE it i reCuired to have e0&(icit(y
de+ined id on the "atched et a core AS# co"&onent uua((y do not render auto id. So even
thou,h "anua((y de+ined id 'onOt be re+erenced direct(yE they are ti(( reCuired +or !#S to be
co((ected and end in the reCuet.
#or +u(( re+erence o+ /Duery e(ector a&iE eeK
http://api.,Buery.com/category/selectors/
505
'.' PartialSubmit
*ore AS# A/a0 i"&(e"entation and by de+au(t !ri"e#ace eria(i=e the 'ho(e +or" to bui(d the
&ot data in a/a0 reCuet o the a"e data i &oted /ut (i3e in a nonBa/a0 reCuet. 9hi ha a
do'nide in (ar,e vie' 'here you on(y need to &roceQe0ecute a "inor &art o+ the vie'. Au"e
you have a +or" 'ith 100 in&ut +ie(dE there i an in&ut +ie(d 'ith a/a0behavior attached &rocein,
on(y ite(+?bthi@ and then u&date another +ie(d onb(ur. A(thou,h on(y a &articu(ar in&ut +ie(d i
&roceedE 'ho(e +or" data 'i(( be &oted 'ith the unneceary in+or"ation that 'ou(d be i,nored
durin, erver ide &rocein, but conu"e reource.
!ri"e#ace &rovide &artia(Sub"it +eature to reduce the net'or3 tra++ic and co"&utin, on c(ient
ide. When &artia(Sub"it i enab(edE on(y data o+ co"&onent that 'i(( be &artia((y &roceed on the
erver ide are eria(i=ed. 1y de+au(t &artia(Sub"it i diab(ed and you can enab(e it ,(oba((y uin, a
conte0t &ara"eter.
<conte&t3param>
<param3name>primefaces.8K=5I!</param3name>
<param3value>partial</param3value>
</conte&t3param>
*o"&onent (i3e button and behavior (i3e &Na/a0 are eCui&&ed 'ith &artia(Sub"it o&tion o you
can override the ,(oba( ettin, &er co"&onent.
<p:command=utton value'(8u-mit( partial8u-mit'(true[false( />
506
3. !aascript API
!ri"e#ace render unobtruive /avacri&t 'hich c(ean(y e&arate behavior +ro" the ht"(. *(ient
ide en,ine i &o'ered by /Duery verion 1.2.1 'hich i the (atet at the ti"e o+ the 'ritin,.
3.1 PrimeFaces 0amespace
PrimeFaces i the "ain /avacri&t ob/ect &rovidin, uti(itie and na"e&ace.
!et"od Description
eca&e*(ientId?id@ Eca&ed AS# id 'ith e"i co(on to 'or3 'ith /Duery.
addSub"it!ara"?e(E na"eE &ara"@ Add reCuet &ara"eter dyna"ica((y to the e(e"ent.
,et*oo3ie?na"e@ Return coo3ie 'ith ,iven na"e.
et*oo3ie?na"eE va(ue@ Set a coo3ie 'ith ,iven na" and va(ue.
3inIn&ut?in&ut@ !ro,reive(y enhance an in&ut e(e"ent 'ith the"in,.
in+o?",@E debu,?",@E 'arn?",@E error?",@ *(ient ide (o, A!I.
chan,e9he"e?the"e@ *han,e the"e on the +(y 'ith no &a,e re+reh.
c(eanWater"ar3?@ Water"ar3 co"&onent e0tenionE c(ean a((
'ater"ar3 on &a,e be+ore ub"ittin, the +or".
ho'Water"ar3?@ Sho' 'ater"ar3 on +or".
9o be co"&atib(e 'ith other /avacri&t entitie on a &a,eE !ri"e#ace de+ine t'o /avacri&t
na"e&aceK
Prime+aces.0idget.*
*ontain cuto" !ri"e#ace 'id,et (i3eK
B !ri"e#ace.'id,et.Data9ab(e
B !ri"e#ace.'id,et.9ree
B !ri"e#ace.'id,et.!o((
B and "ore...
8ot o+ the co"&onent have a corre&ondin, c(ient ide 'id,et 'ith a"e na"e.
PrimeFaces.ajax.*
!ri"e#ace.a/a0 na"e&ace contain the a/a0 A!I 'hich i decribed in ne0t ection.
507
3.2 A,a- API
!ri"e#ace A/a0 Aavacri&t A!I i &o'ered by /Duery and o&ti"i=ed +or AS#. Who(e A!I conit
o+ three &ro&er(y na"e&aced i"&(e /avacri&t +unction.
PrimeFaces.a,a-."eFuest
Send a/a0 reCuet that e0ecute AS# (i+ecyc(e and retrieve &artia( out&ut. #unction i,nature i a
+o((o'K
#rime6aces.a,a&.CeBuest.handle9cfg:;
$on%i&uration ;ptions
6ption Description
+or"Id Id o+ the +or" e(e"ent to eria(i=eE i+ not de+ined &arent +or" o+
ource i ued.
aync #(a, to de+ine 'hether reCuet hou(d ,o in a/a0 Cueue or notE de+au(t
i +a(e.
,(oba( #(a, to de+ine i+ &Na/a0Statu hou(d be tri,,ered or notE de+au(t i
true.
u&date *o"&onent?@ to u&date 'ith a/a0.
&roce *o"&onent?@ to &roce in &artia( reCuet.
ource *(ient id o+ the ource co"&onent cauin, the reCuet.
&ara" Additiona( &ara"eter to end in a/a0 reCuet.
ontart?@ Aavacri&t ca((bac3 to &roce be+ore endin, the a/a0 reCuetE return
+a(e to cance( the reCuet.
onucce?dataE tatuE 0hrE ar,@ Aavacri&t ca((bac3 to &roce 'hen a/a0 reCuet return 'ith ucce
code. 9a3e +our ar,u"entE 0"( re&oneE tatu codeE
0"(htt&reCuet and o&tiona( ar,u"ent &rovided by ReCuet*ontent
A!I.
onerror?0hrE tatuE e0ce&tion@ Aavacri&t ca((bac3 to &roce 'hen a/a0 reCuet +ai(. 9a3e three
ar,u"entE 0"(htt&reCuetE tatu trin, and e0ce&tion thro'n i+ any.
onco"&(ete?0hrE tatuE ar,@ Aavacri&t ca((bac3 to &roce 'hen a/a0 reCuet co"&(ete. 9a3e
three ar,u"entE 0"(htt&reCuetE tatu trin, and o&tiona( ar,u"ent
&rovided by ReCuet*onte0t A!I.
508
/-amples
Su&&oe you have a AS# &a,e ca((ed create(ser 'ith a i"&(e +or" and o"e in&ut co"&onent.
<h:form id'(user6orm(>
<h:input!e&t id'(username( value'(./user=ean.user.name0( />
... 5ore components
</h:form>
Mou can &ot a(( the in+or"ation 'ith a/a0 uin,K
#rime6aces.a,a&.CeBuest.handle9/
formId:user6orm
Hsource:user6orm
Hprocess:user6orm
0:;
8ore co"&(e0 e0a"&(e 'ith additiona( o&tionK
#rime6aces.a,a&.CeBuest.handle9/
formId: ?user6orm?H
source: ?user6orm?H
process: ?user6orm?H
update: ?msgs?&
params:/
?paramLname*?:?value*?H
?paramLnameA?:?valueA?
0H
oncomplete:function9&hrH status: /alert9?Done?:;0
0:;
We hi,h(y reco""end uin, &Nre"ote*o"&onent intead o+ (o' (eve( /avacri&t a&i a it ,enerate
the a"e 'ith "uch (e e++ort and (e &oibi(ity to do an error.
PrimeFaces.a,a-."esponse
!ri"e#ace.a/a0.Re&one.hand(e?@ u&date the &eci+ied co"&onent i+ any and ynchroni=e the
c(ient ide AS# tate. D78 u&date are i"&(e"ented uin, /Duery 'hich ue a very +at a(,orith".
509
5. Dialo& Framewor+
Dia(o, #ra"e'or3 ?D#@ i ued to o&en an e0terna( 0ht"( &a,e in a dia(o, that i ,enerated
dyna"ica((y on runti"e. 9hi i Cuite di++erent to re,u(ar ua,e o+ dia(o, 'ith dec(arative &Ndia(o,
co"&onent a D# i baed on a &ro,ra""atic A!I 'here dia(o, are created and detroyed at
runti"e. <ote that D# and the dec(arative a&&roach are t'o di++erent 'ay and both can even be
ued to,ether. Ua,e i Cuite i"&(eE ReCuet*onte0t ha o&enDia(o, and c(oeDia(o, "ethodK
/WW
W Open a view in dialog.
W Zparam outcome !he logical outcome used to resolve a navigation case.
W/
pu-lic a-stract void openDialog98tring outcome:;

/WW
W Open a view in dialog.
W Zparam outcome !he logical outcome used to resolve a navigation case.
W Zparam options onfiguration options for the dialog.
W Zparam params #arameters to send to the view displayed in a dialog.
W/
pu-lic a-stract void openDialog98tring outcomeH 5ap<8tringHO-,ect> optionsH
5ap<8tringH7ist<8tring>> params:;

/WW
W lose a dialog.
W Zparam data Optional data to pass -ac2 to a dialogCeturn event.
W/
pu-lic a-stract void closeDialog9O-,ect data:;
$on%i&uration
D# reCuire the +o((o'in, con+i,uration to be &reent in +ace con+i, +i(e.
<application>
<action3listener>
org.primefaces.application.Dialog<ction7istener
</action3listener>
<navigation3handler>
org.primefaces.application.DialogJavigation4andler
</navigation3handler>
<view3handler>
org.primefaces.application.Dialog@iew4andler
</view3handler>
</application>
)ettin& Started
Si"&(et ue cae o+ D# i o&enin, an 0ht"( vie' (i3e cars.$html in a dia(o,K
510
<!DO!"#$ html>
<html &mlns'(http://www.w).org/*+++/&html( &mlns:h'(http://,ava.sun.com/,sf/html(

<h:head>
<title>ars</title>
</h:head>

<h:-ody>
//columns
</p:data!a-le>
</h:-ody>
</html>
7n the hot &a,eE ca(( ReCuet*onte0t.o&enDia(o,?Ivie'na"eI@K
<p:command=utton value'(@iew ars( action7istener'(./host=ean.view0( />
pu-lic void view9: /
CeBuestonte&t.geturrentInstance9:.openDialog9(viewars(:;
0
7nce the re&one i received +ro" the reCuet caued by co""and button a dia(o, 'ou(d be
,enerated 'ith the content o+ vie'*ar.0ht"(. 9it(e o+ the dia(o, i retrieved +ro" the tit(e e(e"ent
o+ the vie'*arE in thi caeE *ar.
Dialo& $on%i&uration
7ver(oaded o&enDia(o, "ethod &rovide advanced con+i,uration re,ardin, the viua( o+ dia(o,
a(on, 'ith &ara"eter to end to the dia(o, content.
<p:command=utton value'(@iew ars( action7istener'(./host=ean.viewustomiOed0( />
5ap<8tringHO-,ect> options ' new 4ash5ap<8tringH O-,ect>9:;
options.put9(modal(H true:;
options.put9(dragga-le(H false:;
options.put9(resiOa-le(H false:;
options.put9(content4eight(H )A0:;

CeBuestonte&t.geturrentInstance9:.openDialog9(viewars(H optionsH null:;
0
511
.ere i the +u(( (it o+ con+i,uration o&tionK
"oda( 0 1oo(ean *ontro( "oda(ity o+ the dia(o,.
rei=ab(e 1 1oo(ean When enab(edE "a3e dia(o, rei=ab(e.
dra,,ab(e 1 1oo(ean When enab(edE "a3e dia(o, dra,,ab(e.
'idth auto Inte,er Width o+ the dia(o,.
hei,ht auto Inte,er .ei,ht o+ the dia(o,.
contentWidth 4-0 Inte,er Width o+ the dia(o, content.
content.ei,ht auto Inte,er .ei,ht o+ the dia(o, content.
c(oab(e true 1oo(ean Whether the dia(o, can be c(oed or not.
Data $ommunication
!a,e di&(ayed in the dia(o, can &a data bac3 to the &arent &a,e. 9he tri,,er co"&onent need to
have dialog+eturn a/a0 behavior event to hoo3Bin 'hen data i returned +ro" dia(o,.
<!DO!"#$ html>
<html &mlns'(http://www.w).org/*+++/&html( &mlns:h'(http://,ava.sun.com/,sf/html(

<h:head>
<title>ars</title>
</h:head>

<h:-ody>
//columns
<p:column header!e&t'(8elect(>
<p:command=utton icon'(ui3icon3search(
action7istener'(./ta-le=ean.selectar6romDialog9car:0( />
</p:column>
</p:data!a-le>
</h:-ody>
</html>
pu-lic void selectar6romDialog9ar car: /
CeBuestonte&t.geturrentInstance9:.closeDialog9car:;
0
At hot &a,eE the button that tri,,ered the dia(o, hou(d have dialog+eturn event.
512
<p:command=utton value'(@iew ars( action7istener'(./host=ean.viewars0(>
<p:a,a& event'(dialogCeturn( listener'(./host=ean.handleCeturn0(
</p:command=utton>
CeBuestonte&t.geturrentInstance9:.openDialog9(viewars(:;
0
pu-lic void handleCeturn98elect$vent event: /
ar car ' 9ar: event.getO-,ect9:;
0
"emar+s on Dialo& Framewor+
At the "o"entE &Nco""and1utton and &Nco""and6in3 u&&ort

dialog+eturn.
G <eted dia(o, are not u&&orted.
G *a(( to Dia(o,#ra"e'or3 A!I 'ithin a nonBa/a0 are i,nored.
Dialo& Messa&es
Di&(ayin, #ace8ea,e in a Dia(o, i a co""on cae 'here a +ace"ea,e need to be added
to the conte0t +irtE dia(o, content containin, a "ea,e co"&onent need to be u&dated and +ina((y
dia(o, ,et ho'n 'ith c(ient ide a&i. D# ha a i"&(e uti(ity to by&a thi &roce by &rovidin, a
hortcutK
/WW
W Displays a message in a dialog.
W Zparam message 6aces5essage to -e displayed.
W/
pu-lic a-stract void show5essageInDialog96aces5essage message:;
Uin, thi hortcut it i /ut one (ine to i"&(e"ent the a"e +unctiona(ityK
<p:command=utton value'(8how( action7istener'(./-ean.save0( />
pu-lic void save9: /
//-usiness logic
CeBuestonte&t.geturrentInstance9:.show5essageInDialog9new
6aces5essage96aces5essage.8$@$CI!"LIJ6OH
(1hat we do in life(H ($choes in eternity.(:;:;
0
513
6. $lient Side <alidation
!ri"e#ace *(ient Side >a(idation ?*S>@ #ra"e'or3 i the "ot co"&(ete and advanced *S>
o(ution +or AavaServer #ace and Aava EE. *S> u&&ort +or AS# i not an eay ta3E it i not i"&(e
a inte,ratin, a )rd &arty /avacri&t &(u,in a AS# ha it o'n (i+ecyc(eE conce&t (i3e converion
and then va(idationE &artia( &rocein,E +ace"ea,e and "any "ore. Rea( *S> +or AS# hou(d be
co"&atib(e 'ith erver ide i"&(e"entationE hou(d do 'hat AS# doeE o that uer do not
e0&erience di++erence behavior on c(ient ide and erver ide.
G *o"&atib(e 'ith Server Side I"&(e"entation.
G *onverion and >a(idation ha&&en at c(ient ide.
G !artia( !roce:U&date u&&ort +or A/a0.
G I12n u&&ort a(on, 'ith co"&onent &eci+ic "ea,e.
G *(ient ide Renderer +or "ea,e co"&onent.
G Eay to 'rite cuto" c(ient converter and va(idator.
G G(oba( or *o"&onent baed enab(eQdiab(e.
G Advanced 1ean >a(idation Inte,ration.
G 6itt(e +oot&rint uin, .9865.
6.1 $on%i&uration
*>S i diab(ed by de+au(t and a ,(oba( &ara"eter i reCuired to turn it on.
<conte&t3param>
<param3name>primefaces.7I$J!L8ID$L@<7ID<!IOJ</param3name>
<param3value>true</param3value>
</conte&t3param>
At &a,e (eve(E enab(e validateClient attribute o+ co""and1utton and co""and6in3 co"&onent.
<h:form>
<p:messages />
<p:input!e&t reBuired'(true( />
<p:input!e&tarea reBuired'(true( />
<p:command=utton value'(8ave( validatelient'(true( a,a&'(false(/>
</h:form>
9hat i a(( +or the baicE c(ic3in, the button va(idate the +or" at c(ient ide and di&(ay the error
uin, "ea,e co"&onent.
*S> 'or3 +or !ri"e#ace co"&onent on(yE tandard hN J co"&onent are not u&&orted.
6.2 A,a- s 0on>A,a-
*S> 'or3 di++erent(y de&endin, on the reCuet ty&e o+ the tri,,er co"&onent to be co"&atib(e
'ith cae 'here *>S i not enab(ed.
514
0on>A,a-
In nonBa/a0 caeE a(( viib(e and editab(e in&ut co"&onent in the +or" are va(idated and "ea,e
co"&onent "ut be &(aced inide the +or".
A,a-
*S> u&&ort &artia( &rocein, and u&date on c(ient ide a 'e((E i+ &roce attribute i enab(edE
the co"&onent that 'ou(d be &roceed at erver ide ,et va(idated at c(ient ide. Si"i(ary i+
u&date attribute i de+inedE on(y "ea,e co"&onent inide the u&dated &art ,et rendered. Who(e
&roce ha&&en at c(ient ide.
6.# /ents
*S> &rovide a behavior ca((ed &Nc(ient1ehavior to do intant va(idation in cae you do not 'ant to
'ait +or the uer to +i(( in the +or" and hit co""and1uttonQco""and6in3. Uin, c(ient1ehavior
and cuto" eventE *S> +or a &articu(ar co"&onent can run 'ith event uch a chan,e ?de+au(t@E
b(urE 3eyu&.
<h:form>
<p:panel header'(@alidate(>
<h:panelIrid columns'(E( cellpadding'(5(>
<h:output7a-el for'(te&t( value'(!e&t: 9hange:( />
<p:input!e&t id'(te&t( value'(./validation=ean.te&t0( reBuired'(true(>
<f:validate7ength minimum'(A( ma&imum'(5( />
<p:client@alidator />
</p:input!e&t>
<p:message for'(te&t( display'(icon( />
<h:output!e&t value'(./validation=ean.te&t0( />
<h:output7a-el for'(integer( value'(Integer: 9Teyup:( />
<p:input!e&t id'(integer( value'(./validation=ean.integer0(>
<p:client@alidator event'(2eyup(/>
</p:input!e&t>
<p:message for'(integer( display'(icon( />
<h:output!e&t value'(./validation=ean.integer0( />
</h:panelIrid>
<p:command=utton value'(8ave( a,a&'(false( icon'(ui3icon3chec2(
validatelient'(true(/>
</p:panel>
</h:form>
6.' Messa&es
>a(idation error are di&(ayed a the a"e 'ay in erver ide va(idationE te0t are retrieved +ro" a
c(ient ide bund(e and "ea,e co"&onent are reCuired +or the di&(ay.
I170
De+au(t (an,ua,e i En,(ih +or the *S> "ea,e and +or other (an,ua,e or to cuto"i=e the
de+au(t "ea,eE !ri"e#ace 6oca(e bund(e need to be &reent at the &a,e i+ youOd (i3e to &rovide
t r a n ( a t i o n . # o r " o r e i n + o o n ! r i " e # a c e 6 o c a ( e E v i i t
htt&NQQcode.,oo,(e.co"Q&Q&ri"e+aceQ'i3iQ!ri"e#ace6oca(e.
515
"enderin&
!ri"e#ace "ea,e co"&onent have c(ient ide renderer +or *S> u&&ortE thee are &N"ea,eE
&N"ea,e and &N,ro'(. *o"&onent o&tion (i3e ho'Su""aryE ho'Detai(E ,(oba(7n(yE "ode are
a(( i"&(e"ented by c(ient ide renderer +or co"&atibi(ity.
6.3 .ean <alidation
*S> ha bui(tBin inte,ration 'ith 1ean >a(idation by va(idatin, the contraint de+ined 'ith
annotation at c(ient ide.
<h:form>
<p:growl />
<h:panelIrid>
<p:input!e&t id'(name( value'(./-ean.name0( la-el'(Jame(/>
<p:message for'(name( />
<h:output7a-el for'(age( value'(<ge: 9Z5in9*0: Z5a&9A0::( />
<p:input!e&t id'(age( value'(./-ean.age0( la-el'(<ge(/>
<p:message for'(age( />
</h:panelIrid>
<p:command=utton value'(8ave( validatelient'(false( a,a&'(false( />
</h:form>
pu-lic class =ean /
Z8iOe9min'AHma&'5:

Z5in9*0: Z5a&9A0:
private Integer age;
0
A(( o+ the tandard contraint are u&&orted.
6.5 /-tendin& $S<
Uin, *S> A!IE it i eay to 'rite your o'n cuto" converter and va(idator.
/mail <alidator with !SF
Mour cuto" va(idator "ut i"&(e"ent *(ient>a(idator inter+ace to &rovide the c(ient va(idator id
and the o&tiona( "etadata.
516
pac2age org.primefaces.e&amples.validate;
import ,ava.util.5ap;
import ,ava.util.rege&.#attern;
import ,ava&.faces.application.6aces5essage;
import ,ava&.faces.component.KIomponent;
import ,ava&.faces.conte&t.6acesonte&t;
import ,ava&.faces.validator.6aces@alidator;
import ,ava&.faces.validator.@alidator;
import ,ava&.faces.validator.@alidator$&ception;
import org.primefaces.validate.lient@alidator;
Z6aces@alidator9(custom.email@alidator(:
pu-lic class $mail@alidator implements @alidatorH lient@alidator /
private #attern pattern;

private static final 8tring $5<I7L#<!!$CJ ' (`QL<3Xa3O03+3\\>S>9\\.QL<3Xa3O03
+3S>:WZ( > (Q<3Xa3O03+3S>9\\.Q<3Xa3O03+S>:W9\\.Q<3Xa3OS/AH0:V(;

pu-lic $mail@alidator9: /
pattern ' #attern.compile9$5<I7L#<!!$CJ:;
0
pu-lic void validate96acesonte&t conte&tH KIomponent componentH O-,ect value:
throws @alidator$&ception /
if9value '' null: /
return;
0

if9!pattern.matcher9value.to8tring9::.matches9:: /
throw new @alidator$&ception9new
6aces5essage96aces5essage.8$@$CI!"L$CCOCH (@alidation $rror(H
value > ( is not a valid email;(::;
0
0
pu-lic 5ap<8tringH O-,ect> get5etadata9: /
return null;
0
pu-lic 8tring get@alidatorId9: /
return (custom.email@alidator(;
0
0
>a(idator i &(u,,edBin uin, the tandard 'ay.
<h:form>
<p:messages />
<p:input!e&t id'(email( value'(./-ean.value0(>
<f:validator validatorId'(custom.email@alidator( />
</p:input!e&t>
<p:message for'(email( />
</h:form>
517
6at te& i i"&(e"entin, the va(idator at c(ient ide and con+i,urin, it.
#rime6aces.validatorQ?custom.email@alidator?S ' /

pattern: /\8>Z\8>/H

validate: function9elementH value: /
//use element.data9: to access validation metadataH in this case there is
none.
if9!this.pattern.test9value:: /
throw /
summary: ?@alidation $rror?H
detail: value > ? is not a valid email.?
0
0
0
0;
In o"e cae your va(idator "i,ht need "etadataE +or e0a"&(e 6en,th>a(idator reCuire "in and
"a0 contraint to va(idate a,aint. Server ide va(idator can &a thee by overridin, the
get-etadata! "ethod by &rovidin, a "a& o+ na"eEva(ue &air. At c(ient ideE thee are acceed via
element.data"ey!.
pu-lic 5ap<8tringH O-,ect> get5etadata9: /
5ap<8tringHO-,ect> data ' new 4ash5ap<8tringHO-,ect>9:;
data.put9(data3prime(H *0:;
return data;
0
var prime ' element.data9(prime(:; //*0
//validate
0
Si"i(ar(y a c(ient ide converter can be 'ritten by i"&(e"entin, *(ient*onverter A!I and
overridin, convert7 functionelement6 submitted2alue! FG "ethod to return a /avacri&t ob/ect.
/mail <alidator with .ean <alidation
1ean >a(idation i a(o u&&orted +or e0tenionE here i an e0a"&(e o+ a bE"ai( va(idator.
//imports
import org.primefaces.validate.-ean.lientonstraint;
Z!arget9/5$!4ODH6I$7DH<JJO!<!IOJL!"#$0:
ZCetention9CKJ!I5$:
Zonstraint9validated=y'$mailonstraint@alidator.class:
Zlientonstraint9resolved=y'$maillient@alidationonstraint.class:
ZDocumented
pu-lic Zinterface $mail /
8tring message9: default (/org.primefaces.e&amples.primefaces0(;
lass<M>QS groups9: default /0;
lass<M e&tends #ayload>QS payload9: default /0;
0
518
b*ontraint i the re,u(ar va(idator +ro" 1ean >a(idation A!I and b*(ient*onraint i +ro" *S>
A!I to reo(ve "etadata.
pu-lic class $mailonstraint@alidator
implements onstraint@alidator<$mailH 8tring>/
private #attern pattern;

private static final 8tring $5<I7L#<!!$CJ ' (`QL<3Xa3O03+3\\>S>9\\.QL<3Xa3O03
+3S>:WZ(
> (Q<3Xa3O03+3S>9\\.Q<3Xa3O03
+S>:W9\\.Q<3Xa3OS/AH0:V(;

pu-lic void initialiOe9$mail a: /
pattern ' #attern.compile9$5<I7L#<!!$CJ:;
0
pu-lic -oolean is@alid98tring valueH onstraint@alidatoronte&t cvc: /
if9value '' null:
return true;
else
return pattern.matcher9value.to8tring9::.matches9:;
0

0
pu-lic class $maillient@alidationonstraint implements lient@alidationonstraint /
pu-lic static final 8tring 5$88<I$L5$!<D<!< ' (data3p3email3msg(;

pu-lic 5ap<8tringH O-,ect> get5etadata9onstraintDescriptor constraintDescriptor:
/
5ap<8tringHO-,ect> metadata ' new 4ash5ap<8tringH O-,ect>9:;
5ap attrs ' constraintDescriptor.get<ttri-utes9:;
O-,ect message ' attrs.get9(message(:;
if9message !' null: /
metadata.put95$88<I$L5$!<D<!<H message:;
0

return metadata;
0
pu-lic 8tring get@alidatorId9: /
return $mail.class.get8impleJame9:;
0

0
#ina( &art i i"&(e"entin, the c(ient ide va(idatorK
519
#rime6aces.validatorQ?$mail?S ' /

pattern: /\8>Z\8>/H

5$88<I$LID: ?org.primefaces.e&amples.validate.email.message?H

var vc ' #rime6aces.util.@alidationonte&t;
if9!this.pattern.test9value:: /
var msg8tr ' element.data9?p3email3msg?:H
msg ' msg8tr M /summary:msg8trH detail: msg8tr0 :
vc.get5essage9this.5$88<I$LID:;

throw msg;
0
0
0;
Ua,e i a"e a uin, tandard contraintK
<h:form>
<p:messages />
<p:input!e&t id'(email( value'(./-ean.value0( />
<p:message for'(email( />
</h:form>
pu-lic class =ean /
Z$mail
private 8tring value;
//getter3setter
0
520
7. 1hemes
!ri"e#ace i inte,rated 'ith &o'er+u( 9he"eRo((er *SS #ra"e'or3. *urrent(y there are )0H &reB
dei,ned the"e that you can &revie' and do'n(oad +ro" !ri"e#ace the"e ,a((ery.
http://www.primefaces.org/themes.html
521
7.1 Applyin& a 1heme
A&&(yin, a the"e to your !ri"e#ace &ro/ect i very eay. Each the"e i &ac3a,ed a a /ar +i(eE
do'n(oad the the"e you 'ant to ueE add it to the c(a&ath o+ your a&&(ication and then de+ine
&ri"e+ace.9.E8E conte0t &ara"eter at your de&(oy"ent decri&tor ?'eb.0"(@ 'ith the the"e
na"e a the va(ue.
Download
Each the"e i avai(ab(e +or "anua( do'n(oad at !ri"e#ace 9he"e Ga((ery. I+ you are a "aven
uerE de+ine the"e arti+act aK
<dependency>
<groupId>org.primefaces.themes</groupId>
<artifactId>cupertino</artifactId>
<version>*.0.G</version>
</dependency>
arti+actId i the na"e o+ the the"e a de+ined at 9he"e Ga((ery &a,e.
$on%i&ure
7nce youOve do'n(oaded the the"eE con+i,ure !ri"e#ace to ue it.
<conte&t3param>
<param3value>aristo</param3value>
</conte&t3param>
9hatO itE you donOt need to "anua((y add any c to your &a,e or anythin, e(eE !ri"e#ace 'i((
hand(e everythin, +or you.
In cae youd (i3e to "a3e the the"e dyna"icE de+ine an E6 e0&reion a the &ara" va(ue.
<conte&t3param>
<param3value>./loggedInKser.preferences.theme0</param3value>
</conte&t3param>
522
7.2 $reatin& a 0ew 1heme
I+ youd (i3e to create your o'n the"e intead o+ uin, the &reBde+ined oneE that i eay a 'e((
becaue 9he"eRo((er &rovide a &o'er+u( and eay to ue on(ine viua( too(.
A&&(yin, your o'n cuto" the"e i a"e a a&&(yin, a &reBbui(t the"e ho'ever you need to
"i,rate the do'n(oaded the"e +i(e +ro" 9he"eRo((er to !ri"e#ace 9he"e In+ratructure.
!ri"e#ace 9he"e convention i the inte,rated 'ay o+ a&&(yin, your cuto" the"e to your
&ro/ectE thi a&&roach reCuire you to create a /ar +i(e and add it to the c(a&ath o+ your a&&(ication.
Aar +i(e must have the +o((o'in, +o(der tructure. Mou can have one or "ore the"e in a"e /ar.
- jar
- META-INF
- resources
- primefaces-yourtheme
B theme.css
B images
1@ 9he the"e &ac3a,e youOve do'n(oaded +ro" 9he"eRo((er 'i(( have a c +i(e and i"a,e +o(der.
8a3e ure you have dee(ect a(( co"&onent o&tion on do'n(oad &a,e o that your the"e on(y
inc(ude 3innin, ty(e. E0tract the content o+ the &ac3a,e and rena"e #query1ui1
FversionG.custom.css to theme.css.
%@ I"a,e re+erence in your the"e.c "ut a(o be converted to an e0&reion that AS# reource
(oadin, can undertandE e0a"&(e 'ou(d beK
ur(?Ii"a,eQuiBb,Lhi,h(i,htBhardL100L+9+9+9L10100.&n,I@
hou(d beK
ur(?IXVreourceÒ&ri"e+aceByourthe"eNi"a,eQuiBb,Lhi,h(i,htBhardL100L+9+9+9L10100.&n,OaWI@
7nce the /ar o+ your the"e i in c(a&athE you can ue your the"e (i3eK
<conte&t3param>
<param3value>yourtheme</param3value>
</conte&t3param>
523
7.# (ow 1hemes Wor+
!o'ered by 9he"eRo((erE !ri"e#ace e&arate tructura( c +ro" 3innin, c.
Structura( *SS
9hee ty(e c(ae de+ine the 3e(eton o+ the co"&onent and inc(ude c &ro&ertie uch a "ar,inE
&addin,E di&(ay ty&eE di"enion and &oitionin,.
S3innin, *SS
S3innin, de+ine the (oo3 and +ee( &ro&ertie (i3e co(orE border co(orE bac3,round i"a,e.
S+innin& Selectors
9he"eRo((er +eature a cou&(e o+ 3innin, e(ectorE "ot i"&ortant o+ thee areK
)elector Applies
.uiB'id,et A(( !ri"e#ace co"&onent
.uiB'id,etBheader .eader ection o+ a co"&onent
.uiB'id,etBcontent *ontent ection o+ a co"&onent
.uiBtateBde+au(t De+au(t c(a o+ a c(ic3ab(e
.uiBtateBhover .over c(a o+ a c(ic3ab(e
.uiBtateBactive When a c(ic3ab(e i e(ected
.uiBtateBdiab(ed Diab(ed e(e"ent.
.uiBtateBhi,h(i,ht .i,h(i,hted e(e"ent.
.uiBicon An e(e"ent to re&reent an icon.
9hee c(ae are not a'are o+ tructura( c (i3e "ar,in and &addin,E "ot(y they on(y de+ine
co(or. 9hi c(ean e&aration brin, ,reat +(e0ibi(ity in the"in, becaue you dont need to 3no'
each and every 3innin, e(ector o+ co"&onent to chan,e their ty(e.
#or e0a"&(e !ane( co"&onent header ection ha the .ui1panel1titlebar tructura( c(aE to chan,e
the co(or o+ a &ane( header you dont need to about thi c(a a .ui1widget1header a(o that de+ine
the &ane( co(or a(o a&&(ie to the &ane( header.
524
7.' 1hemin& 1ips
G De+au(t +ont i=e o+ the"e "i,ht be bi,,er than e0&ectedE to chan,e the +ontBi=e o+ !ri"e#ace
co"&onent ,(oba((yE ue the .uiB'id,et ty(e c(a. An e0a"&(e o+ "a((er +ontK
.ui3widgetH .ui3widget .ui3widget /
font3siOe: +0F !important;
0
G When creatin, your o'n the"e 'ith the"ero((er too(E e(ect one o+ the &reBdei,ned the"e that
i c(oe to the co(or che"e you 'ant and cuto"i=e that to ave ti"e.
I+ you are uin, A&ache 9rinidad or A1o Rich#aceE !ri"e#ace 9he"e Ga((ery inc(ude
9rinidad
*aab(anca and Rich#ace 1(ueS3y the"e. Mou can ue thee the"e to "a3e
!ri"e#ace (oo3 (i3e 9rinidad or Rich#ace co"&onent durin, "i,ration.
G 9o chan,e the ty(e o+ a &articu(ar co"&onent intead o+ a(( co"&onent o+ a"e ty&e ue
na"e&acin,E e0a"&(e be(o' de"ontrate ho' to chan,e header o+ a(( &ane(.
.ui3panel3title-ar /
//css
0
or
.ui3panel3title-ar.ui3widget3header /
//css
0
9o a&&(y c on a &articu(ar &ane(K
<p:panel stylelass'(custom(>
...
</p:panel>
.custom .ui3panel3title-ar /
//css
0
525
8. PrimeFaces Push
!ri"e#ace !uh ?!#!@ i a &uh +ra"e'or3 bui(t on to& o+ At"o&here. At"o&here creator
AyncI7 i a &artner co"&any o+ !ri"e9e3 and the deve(o&er o+ !#!. At"o&here i hi,h(y
ca(ab(eE u&&ort evera( container and bro'erE uti(i=e variou tran&ort uch a 'eboc3etE
eeE (on,B&o((in,E trea"in, and /on&. #or "ore in+or"ation &(eae viitK
https://githu-.com/<tmosphere/atmosphere
8.1 Setup
Atmosphere
At"o&here i reCuired to run !ri"e#ace !uhE in your &o".0"( de+ine the de&endency aK
<dependency>
<groupId>org.atmosphere</groupId>
<artifactId>atmosphere3runtime</artifactId>
<version>A.*.)</version>
</dependency>
Push Serlet
!uh Serv(et i ued a a ,ate'ay +or c(ient.
<servlet>
<servlet3name>#ush 8ervlet</servlet3name>
<servlet3class>org.primefaces.push.#ush8ervlet</servlet3class>
<async3supported>true</async3supported>
</servlet>
<servlet3mapping>
<servlet3name>#ush 8ervlet</servlet3name>
<url3pattern>/primepush/W</url3pattern>
</servlet3mapping>
526
8.2 Annotations
Dei,n o+ !#! i annotation driven centra(i=ed around the "ain b!uhEnd!oint.
GPush/ndPoint
9he eaiet 'ay to create !#! a&&(ication i by uin, the HPushEndPoint annotation. 9hi
annotation i"&(i+ie the &roce to bui(d an a&&(ication uin, !#! avodin, the need to interact 'ith
At"o&here "ore o&hiticated A!I. 9hi annotation i,ni+icant(y reduce the nu"ber o+ code
reCuired to bui(d a &o'er+u( rea( ti"e a&&(ication by tran&arent(y inta((in, At"o&here
co"&onent (i3e heartbeatE id(e connection detectionE diconnect tate recovery etc. It a(o a((o'
the ue o+ e0terna( de&endency in/ection +ra"e'or3 (i3e *DIE S&rin, or Guice. Annotation &rovide
one attribute ca((ed &ath to de+ine the reource &ath.
pat"N 9he &ath to the reource.
9he de+au(t i IQI o i+ your have "a&&ed the !uhServ(et to IQJIE a(( reCuet 'i(( be de(ivered to
your annotated c(a. Mou can a(o cuto"i=e the &ath. 9he &ath va(ue 'i(( be ued to "a& an
inco"in, reCuet uri &ath to an annotated !uhEnd&oint c(a.
Z#ush$nd#oint9(/chat(:
GSin&leton
Sin,(eton annotation i ued to +orce creatin, a in,(eE thread a+e intance o+ a !uhEnd&oint
annotated c(ae. #or e0a"&(eE i+ your a&&(ication et the b!uhEnd&ointZ &ath attribute 'ith a
&athE by de+au(t a ne' intance o+ the annotated c(ae 'i(( be created. When annotated 'ith
Sin,(eton ho'everE a in,(e c(a 'i(( be created.
G;n;pen
9he 7n7&en?@ 'i(( be invo3ed 'hen the under(yin, connection i ready to be uedE e., +or 'rite
o&eration. Annotated "ethod need to ta3e the +or" o+K
ZOnOpen
pu-lic void onOpen9:;

ZOnOpen
pu-lic void onOpen9Cemote$ndpoint r:;

ZOnOpen
pu-lic void onOpen9Cemote$ndpoint rH $vent=us e:;
9he Re"oteEnd&oint re&reent the &hyica( connection and can be ued to 'rite o"e data bac3 to
the bro'er. 9he Event1u can be ued to +ire "ea,e to one or "ore Re"oteEnd&oint uin,
re,e0 e0&reion.
G;nMessa&e
9he 7n8ea,e?@ 'i(( be invo3ed 'hen a "ea,e i ready to be de(iverE e., a a reu(t o+ a
Event1u &ub(ih o&eration or 'hen a bro'er i !7S9in, o"e byte. 9he annotationZ attribute
avai(ab(e areK
527
encodersN A (it o+ Èncodera?@ that 'i(( be ued to encode the annotated "ethod return va(ue. 9he
returned va(ue o+ an annotated 7n8ea,e "ethod 'i(( be broadcated to a(( reource aociated
'ith the 1roadcaterE aociated 'ith thi annotated c(ae.
decodersN A (it o+ `Decodera?@ ued to decode a broadcated "ea,e into an ob/ect "atchin, the
"ethod i,nature.
1oth o+ the encoder and decoder can be chainedE "eanin, the returned va(ue o+ an encoderB
decoder can be ued a an in&ut +or the ne0t one.
ZOn5essage9encoders ' /Y8OJ$ncoder.class0:
pu-lic 8tring on5essage98tring count: /
return count;
0
7ut o+ the bo0E !ri"e#ace !US. &rovide AS7< i"&(e"entation that areK
B or,.&ri"e+ace.&uh.i"&(.AS7<Encoder
B or,.&ri"e+ace.&uh.i"&(.AS7<Decoder
It i a(o eay to create your o'n encoderBdecoder by i"&(e"entin, org.primefaces.push.Encoder
and org.primefaces.push.'ecoder inter+ace.
G;n$lose
9he b7n*(oe?@ 'i(( be invo3ed 'hen the c(ient diconnectE e., c(oe the connectionE 'hen a
net'or3 outa,e ha&&en or 'hen a &ro0y c(oe the connection. Annotated "ethod need to ta3e the
+or" o+K
ZOnlose
pu-lic void onlose9:;

ZOnlose
pu-lic void onlose9Cemote$ndpoint r:;

ZOnlose
pu-lic void onlose9Cemote$ndpoint rH $vent=us e:;
7n(y one "ethod in a c(a can be annotated 'ith b7n*(oe.
GPathParam
b!ath!ara" i ued to auto"atica((y &are the &ath and ai,n &ath to3en to c(a variab(e.
Z#ush$ndpoint9(/somepath//room0//user0(:
Z8ingleton
pu-lic class hatCesource /
Z#ath#aram9(room(:
private 8tring room;
Z#ath#aram9(user(:
private 8tring username;
//...
528
8.# API
"emote/ndPoint
9he Re"oteEnd&oint?@ c(a re&reent the re"ote connectionE e., the 1ro'er. An intance o+
Re"oteEnd&oint ho(d in+or"ation about the headerE CueryStrin,E bodyE uriE &ath and &ath e,"ent
that can be ued +or "ani&u(atin, the inco"in, reCuet. I+ you are +a"i(iar 'ith the Serv(et
I.tt&Serv(etReCuetIE the Re"oteEnd&oint can be een a an i"&roved verion. Mou can a(o ue a
Re"oteEnd&ointX'rite to 'rite bac3 "ea,e that 'i(( be de(ivered uniCue(y to the bro'er.
/ent.us
A ditributed (i,ht'ei,ht event bu 'hich can enco"&a "u(ti&(e !uhEnd&oint intance. 9he
event bu i"&(e"ent &ub(ih Q ubcribe and &oint to &oint "ea,in,. 8ea,e ent over the
event bu can be o+ any ty&e. #or &ub(ih Q ubcribeE "ea,e can be &ub(ihed to a Aava c(a
annotated 'ith the `!uhEnd&ointXva(uea?@ uin, one o+ the "ethod annotated 'ith `7n8ea,ea?@.
9he Event1u i the reco""ended 'ay +or de(iverin, "ea,e. Event1u i retrieved viaK
$vent=us event=us ' $vent=us6actory.getDefault9:.event=us9:;
7nce an Event1u intance i avai(ab(eE &ub(ihin, data to ubcriber i done 'ith over(oaded
&ub(ih "ethod.
pu&lis"76&ject o84 #ire ,iven ob/ect to a(( connected Re"oteEnd!oint.
pu&lis"7)tring pat"9 6&ject o84 #ire ,iven ob/ect to Re"oteEnd!oint that connected to the &ath.
pu&lis"7)tring pat"9 6&ject o9 eply reply84 #ire ,iven ob/ect to Re"oteEnd!oint that
connected to the &ath by &ain, a Re&(y intance. Re&(y i an inter+ace 'ith a ca((bac3 ca((ed
completedString path! that i invo3ed 'hen the Event1u de(ivered the "ea,e to the
!uhEnd!oint that "atche the &ath ued to initiate the &ub(ih o&eration.
8.' Soc+et $omponent
Soc3et i a !ri"e#ace co"&onent that hand(e the connection bet'een the erver and the bro'erE
co""on 'ay to ue oc3et i by de+inin, a &ath and a ca((bac3 to hand(e broadcat.
<p:push channel'(/chat( onmessage'(handle#u-lish(/>
See Soc3et co"&onent docu"entation +or the +u(( (it o+ avai(ab(e o&tion.
$lient Side API
Wid,etN PrimeFaces.widget.Soc"et
connect?uri@ uri void *onnect to ,iven uri.
&uh?/on@ /on void !uhe data +ro" c(ient ide.
diconnect B void Diconnect +ro" channe(.
529
8.3 Puttin& It All 1o&ether
!ri"e#ace Sho'cae ha variou &uh de"oE in thi ection t'o o+ the" are covered.
8.3.1 $ounter
*ounter i a ,(oba( counter 'here each button c(ic3 incre"ent the count va(ue and ne' va(ue i
&uhed to a(( ubcriber.
>ie' &a,e ha an out&ut9e0t to di&(ay the va(ueE a button to incre"ent current va(ue to &uhE a
oc3et co"&onent to connect to Qcounter channe( and +ina((y the on8ea,e c(ient ide ca((bac3 to
u&date the UI.
<h:form>
<h:output!e&t value'(./counter@iew.count0( stylelass'(display( />
<p:command=utton value'(lic2( action7istener'(./counter@iew.increment0( />
</h:form>

<p:soc2et on5essage'(handle5essage( channel'(/counter( />
function handle5essage9data: /
V9?.display?:.te&t9data:;
0
</script>
pac2age org.primefaces.e&amples.push.counter;
import ,ava.io.8erialiOa-le;
import ,ava&.faces.-ean.<pplication8coped;
import ,ava&.faces.-ean.5anaged=ean;
import org.primefaces.push.$vent=us;
import org.primefaces.push.$vent=us6actory;
Z5anaged=ean
Z<pplication8coped
pu-lic class ounter@iew implements 8erialiOa-le/
private volatile int count;
pu-lic int getount9: /
return count;
0
pu-lic void setount9int count: /
this.count ' count;
0
count>>;

event=us.pu-lish9(/counter(H 8tring.valueOf9count::;
0
0
530
incre"ent button action(itener +irt add one to the counter va(ueE ,et an Event1u and then
&uhe the ne' va(ue to a(( connected c(ient. #ina( &iece i 'ritin, the *ounterReource to hand(e
"ea,e 'henever a data i &uhed.
pac2age org.primefaces.e&amples.push.counter;
import org.primefaces.push.annotation.On5essage;
import org.primefaces.push.annotation.#ush$ndpoint;
import org.primefaces.push.impl.Y8OJ$ncoder;
Z#ush$ndpoint9(/counter(:
pu-lic class ounterCesource /
pu-lic 8tring on5essage98tring count: /
return count;
0
0
In cae youd (i3e to u&date co"&onent andQor invo3e (itener in your bac3in, bean on broadcatE
you can ue the o&tiona( message a/a0 behavior to i"&(e"ent the a"e +unctiona(ity but 'ith an
e0tra reCuet.
<h:form id'(form(>
<h:output!e&t id'(out( value'(./glo-alounter.count0( />
<p:command=utton value'(lic2( action7istener'(./glo-alounter.increment0( />
</h:form>

<p:soc2et channel'(/counter(>
<p:a,a& event'(message( update'(form:out( />
</p:soc2et>
531
8.3.2 FacesMessa&e
9hi a"&(e ho' ho' to &uh #ace8ea,e +ro" one c(ient to a(( other and di&(ay the" uin,
Gro'( *o"&onent.
<p:growl widget@ar'(growl( showDetail'(true( />

<h:form>
<p:panel header'(Irowl(>
<p:output7a-el for'(summary( value'(8ummary: ( />
<p:input!e&t id'(summary( value'(./growl=ean.summary0( reBuired'(true( />

<p:output7a-el for'(detail( value'(Detail: ( />
<p:input!e&t id'(detail( value'(./growl=ean.detail0( reBuired'(true( />
</h:panelIrid>
<p:command=utton value'(8end( action7istener'(./growl=ean.send0( />
</p:panel>
</h:form>

<p:soc2et on5essage'(handle5essage( channel'(/notify( />
function handle5essage9facesmessage: /
facesmessage.severity ' ?info?;
#69?growl?:.show9QfacesmessageS:;
0
</script>
pac2age org.primefaces.e&amples.view;
import ,ava&.faces.-ean.5anaged=ean;
import ,ava&.faces.-ean.CeBuest8coped;
import ,ava&.faces.conte&t.6acesonte&t;
import ,ava&.faces.event.<ction$vent;
import org.primefaces.push.$vent=us;
import org.primefaces.push.$vent=us6actory;
Z5anaged=ean
ZCeBuest8coped
pu-lic class Irowl=ean /
private final static 8tring 4<JJ$7 ' (/notify(;
private 8tring te&tH summaryH detail;
//getters3setters

pu-lic void send9: /
event=us.pu-lish94<JJ$7H new 6aces5essage9summaryH detail::;
0
0
532
<oti+yReource i"&(y encode the &uhed "ea,e a AS7<.
pac2age org.primefaces.e&amples.push.notify;
import org.primefaces.push.annotation.On5essage;
import org.primefaces.push.annotation.#ush$ndpoint;
import org.primefaces.push.impl.Y8OJ$ncoder;
Z#ush$ndpoint9(/notify(:
pu-lic class JotifyCesource /

pu-lic 6aces5essage on5essage96aces5essage message: /
return message;
0
0
533
8.5 1ips and 1ric+s
Dynamic Paths
*(ient ide A!I 'ou(d be handy to create dyna"ic channe(E channe( na"e o+ the oc3et doe not
need to be tatic and you can create dyna"ic channe( on runti"e ince a channe( i baica((y a &ath
na"e. b!ath!ara" i very handy to auto"atica((y &are the !ath and ai,n the &ath to3en to
variab(e.
See chat a"&(e in ho'cae +or an e0a"&(e o+ dyna"ic channe( ued to end &rivate "ea,e.
Pro-ies
!ro0ie are &rob(e"atic not /ut +or !ri"e#ace !uh B At"o&here o(ution but in a(( o(ution. I+
your &ro0y u&&ort 'eboc3etE "a3e ure to add the neceary con+i,uration. Another o(ution
that i conidered a a 'or3around i to override the de+au(t uri o+ the &uh erver. De+au(t uri i
&rotoco(NQQconte0t!athQ&ri"e&uhQchanne(E +or e0a"&(e !ri"e#ace on(ine ho'cae i runnin, on
/etty that i behind an a&ache "od &ro0y 'hich doent u&&ort 'eboc3et at ti"e o+ the 'ritin,.
So(ution i to con+i,ure !ri"e#ace to ue another &uh erver (i3eK
<conte&t3param>
<param3name>primefaces.#K84L8$C@$CLKC7</param3name>
<param3value>http://www.primefaces.org:G0G0</param3value>
</conte&t3param>
So that oc3et co"&onent by&ae the &ro0y and direct(y co""unicate 'ith the a&&(ication.
Supported Serer and $lient /nironments
At"o&here doe a a,reat /ob in u&&ortin, di++erent erver and bro'er. See the detai(ed (it atK
https://githu-.com/<tmosphere/atmosphere/wi2i/8upported31e-8ervers3and3=rowsers
Scalability
At"o&here i bui(d to ca(e via &(u,in uch a A8SE Redi0E F8!!E .a=e(cat and "ore. Re+er to
at"o&here docu"entation to ee ho' to con+i,ure at"o&here in "ore than one erver.
!uhServ(et e0tend +ro" At"o&hereServ(et o any con+i,uration o&tion +or At"o&hereServ(et
a(o a&&(ie !uhServ(et.
534
1:. PrimeFaces Mobile
!ri"e#ace 8obi(e ?!#8@ i a UI ;it to create AS# a&&(ication o&ti"i=ed +or "obi(e device. !#8
i bui(t on to& o+ /Duery 8obi(eE a touchBo&ti"i=ed .9865 UI +ra"e'or3 &rovidin, u&&ort +or
variou &(at+or".
In addition to the ea"(e inte,ration 'ith /Duery 8obi(eE !#8 +eature a 8obi(e Render3it +or
&o&u(ar !ri"e#ace co"&onentE a/a0 +ra"e'or3 e0tenionE "obi(e a/a0 behavior eventE
inte,rated navi,ation "ode(E (a=y (oadin, o+ &a,eE re&onive 'id,et and "ore.
1*.1 -etup
8obi(e hi& 'ith !ri"e#ace *ore o no additiona( do'n(oad i reCuired.
$on%i&uration
A "obi(e navi,ation hand(er i neceary inide +ace con+i,uration to enab(e navi,ation u&&ort.
<application>
<navigation3handler>
org.primefaces.mo-ile.application.5o-ileJavigation4andler
</navigation3handler>
</application>
1a&lib
!#8 &rovide "obi(e &eci+ic co"&onent 'ith the +o((o'in, ta,(ib.
&mlns:pm'(http://primefaces.org/mo-ile(
"ender@it
Render;it i the core &art o+ !#8 +eaturin, o&ti"i=ed renderer +or "obi(e environ"ent. 9here
are t'o "ain 'ay to enab(e !#8 Render;it.
*ore vie' ta, ha a render;itId attribute to et the renderer 3it o+ the &a,e.
<f:view renderTitId'(#CI5$6<$8L5O=I7$( />
I+ your a&&(ication +u((y conit o+ "obi(e &a,eE then a ,(oba( con+i,uration in +ace con+i,uration
+i(e hou(d be &re+erred intead o+ &er &a,e con+i,uration.
<application>
<default3render32it3id>#CI5$6<$8L5O=I7$</application>
</application>
535
1*.2 Pa%e)
A "obi(e &a,e i a re,u(ar +ace(et 0ht"( +i(e 'ith "obi(e &a,e container de+ined 'ith &"N&a,e.
<!DO!"#$ html>
&mlns:f'(http://,ava.sun.com/,sf/core(
&mlns:pm'(http://primefaces.org/mo-ile(>

<h:head>
</h:head>
<h:-ody>
<pm:page>
<pm:header title'(=asic #age(></pm:header>
<pm:content></pm:content>
</pm:page>
</h:-ody>
</html>
A in,(e &a,e 0ht"( vie' can have "ore than one &a,e. 1y de+au(t the +irt &a,e i viib(e on (oad.
<!DO!"#$ html>

<h:head>
</h:head>
<h:-ody>
<pm:page id'(main(>
<pm:header title'(5ain #age(></pm:header>
</pm:page>
<pm:page id'(second(>
<pm:header title'(8econd #age(></pm:header>
</pm:page>
</h:-ody>
</html>
536
1*.2 /a,i%ation)
!#8 u&&ort a(( 3ind o+ tandard navi,ation 'ith the addition o+ a cuto" navi,ation "ode(.
Internal
Interna( navi,ation i bet'een &a,e in the a"e 0ht"( vie'. 7utco"e hou(d have the pm4 &re+i0
+or thi 3ind o+ navi,ation. Uin, the "u(ti &a,e a"&(e at ection 10.1K
<p:-utton outcome'(pm:second( />
<p:lin2 outcome'(pm:second( />
1utton and 6in3 co"&onent di&(ay the &a,e 'hoe id i second. In cae youOd (i3e to navi,ate
a+ter a !7S9 reCuetE ua,e 'ou(d be i"i(ar.
<p:command=utton value'(Io to 8econd( action'(./-ean.go0( />
pu-lic 8tring go9: /
return (pm:second(;
0
/-ternal
E0terna( navi,ation to another 0ht"( in a"e do"ain or a reource in another do"ain i a"e a
tandard a&&roach.
<p:-utton outcome'(/ui/home( value'(4ome( />
<p:-utton href'(http://www.primefaces.org( value'(4ome( />
1ransitions
>ariou ani"ation are avai(ab(e to run durin, the navi,ation. <a"e o+ the e++ect i a&&ended to the
outco"e. In additionE reverse o&tion i &rovided +or bac3 navi,ation.
<p:-utton outcome'(pm:secondMtransition'pop( />
<p:lin2 outcome'(pm:secondMtransition'flipRreverse'true( />
6it o+ &oib(e tranition i fadeE popE flipE turnE flowE slideE slidefadeE slideup and slidedown. #ade
i the de+au(t tranition and to turn o++ ani"ationE et none a the va(ue.
$lient API
A c(ient ide A!I i avai(ab(e to navi,ate "anua((y +ro" a cuto" /avacri&t code. Si,nature iK
PrimeFaces.-obile.navigateto6 cfg!I
#rime6aces.5o-ile.navigate9?.second?H /
reverse: true[falseH
transition: ?fade?
0:;
537
1*.3 Co'ponent)
1:.#.1 $ontent
*ontent i container co"&onent +or the content area o+ a &a,e.
In%o
9a, content
*o"&onent *(a org.primefaces.mo&ile.component.content.#ontent
*o"&onent 9y&e org.primefaces.mo&ile.#ontent
*o"&onent #a"i(y org.primefaces.mo&ile.component
Renderer 9y&e org.primefaces.mo&ile.component.#ontentenderer
Renderer *(a org.primefaces.mo&ile.component.content.#ontentenderer
Attributes
be rendered.
)ettin& Started with the $ontent
*ontent i a chi(dren co"&onent o+ a &a,e.
<pm:page>
<pm:content>
//page content
</pm:content>
</pm:page>
538
1:.#.2 Field
#ie(d i a re&onive (ayout co"&onent +or (abe(Bin&ut &air.
In%o
9a, field
*o"&onent *(a org.primefaces.mo&ile.component.field.+ield
*o"&onent 9y&e org.primefaces.mo&ile.+ield
Renderer 9y&e org.primefaces.mo&ile.component.+ieldenderer
Renderer *(a org.primefaces.mo&ile.component.field.+ieldenderer
Attributes
be rendered.
)ettin& Started with the Field
#ie(d i ued a the container o+ a (abe( and an in&ut co"&onent. A a re&onive co"&onentE +ie(d
di&(ay the o&ti"a( &(ace"ent +or it chi(dren baed on avai(ab(e 'idth.
<pm:field>
<p:output7a-el for'(te&t( value'(!e&t:( />
<p:input!e&t id'(t&t( />
</pm:field>
539
1:.#.# Footer
#ooter i container co"&onent +or the botto" area o+ a &a,e.
In%o
9a, footer
*o"&onent *(a org.primefaces.mo&ile.component.footer.+ooter
*o"&onent 9y&e org.primefaces.mo&ile.+ooter
Renderer 9y&e org.primefaces.mo&ile.component.+ooterenderer
Renderer *(a org.primefaces.mo&ile.component.footer.+ooterenderer
Attributes
in a bac3in, bean
tit(e nu(( Strin, 9it(e te0t o+ the +ooter.
+i0ed +a(e 1oo(ean !oition the +ooter a +i0ed on cro((.
the"e nu(( Strin, S'atch o+ the co"&onent.
ta&9o,,(e true 1oo(ean #or +i0ed +ooterE et 'hether the +i0ed too(barO viibi(ity can be
to,,(ed by ta&&in, on the &a,e.
)ettin& Started with the Footer
#ooter i a chi(dren co"&onent o+ a &a,e.
<pm:page>
<pm:footer title'(6ooter(></pm:footer>
</pm:page>
540
1:.#.' (eader
.eader i container co"&onent +or the to& area o+ a &a,e.
In%o
9a, "eader
*o"&onent *(a org.primefaces.mo&ile.component."eader.(eader
*o"&onent 9y&e org.primefaces.mo&ile.(eader
*o"&onent #a"i(y org.primefaces.mo&ile.component.(eader
Renderer 9y&e org.primefaces.mo&ile.component.(eaderenderer
Renderer *(a org.primefaces.mo&ile.component."eader.(eaderenderer
Attributes
in a bac3in, bean
tit(e nu(( Strin, 9it(e te0t o+ the header.
+i0ed +a(e 1oo(ean !oition the header a +i0ed on cro((.
the"e nu(( Strin, S'atch o+ the co"&onent.
)ettin& Started with the (eader
.eader i a chi(dren co"&onent o+ a &a,e.
<pm:page>
<pm:header title'(6ooter(></pm:header>
</pm:page>
541
1:.#.3 InputSlider
In&utS(ider i an in&ut co"&onent 'ith a touch enab(ed (ider.
In%o
9a, input)lider
*o"&onent *(a org.primefaces.mo&ile.component.inputslider..nput)lider
*o"&onent 9y&e org.primefaces.mo&ile..nput)lider
*o"&onent #a"i(y org.primefaces.mo&ile.component.
Renderer 9y&e org.primefaces.mo&ile.component..nput)liderenderer
Renderer *(a org.primefaces.mo&ile.component.inputslider..nput)liderenderer
Attributes
rendered.
converter nu(( 7b/ect An e( e0&reion or a (itera( te0t that de+ine a converter
+or the co"&onent. When itZ an E6 e0&reionE itZ
reo(ved to a converter intance. In cae itZ a tatic te0tE
it "ut re+er to a converter id.
va(idator nu(( 7b/ect A "ethod bindin, e0&reion that re+er to a "ethod
va(ue*han,e6itener nu(( 7b/ect A "ethod bindin, e0&reion that re+er to a "ethod +or
hand(in, a va(uechan,eevent.
+ai(.
542
"in>a(ue 0 Inte,er 8ini"u" va(ue o+ the (ider.
"a0>a(ue 100 Inte,er 8a0i"u" va(ue o+ the (ider.
te& 1 Strin, Ste& +actor to a&&(y on (ider "ove.
diab(ed +a(e 1oo(ean Diab(e or enab(e the (ider.
hi,h(i,ht +a(e 1oo(ean .i,h(i,ht the va(ue ran,e 'hen enab(ed.
)ettin& Started with the InputSlider
In&utS(ider reCuire an inte,er a it va(ue.
<pm:input8lider value'(50( />
<pm:input8lider value'(./-ac2ing@iew.integer#roperty0( />
.oundaries
0 and 100 are the de+au(t boundarieE thee can be cuto"i=ed uin, min2alue and ma$2alue.
<pm:input8lider min@alue'(*00( ma&@alue'(A00( value'(./-ac2ing@iew.int#roperty0(/>
543
1:.#.5 Pa&e
!a,e i "ain co"&onent to de+ine an interna( &a,e 'ithin an 0ht"(.
In%o
9a, page
*o"&onent *(a org.primefaces.mo&ile.component.page.Page
*o"&onent 9y&e org.primefaces.mo&ile.Page
Renderer 9y&e org.primefaces.mo&ile.component.Pageenderer
Renderer *(a org.primefaces.mo&ile.component.page.Pageenderer
Attributes
in a bac3in, bean
tit(e nu(( Strin, 9it(e te0t o+ the &a,e.
the"e nu(( Strin, S'atch o+ the &a,e.
(a=y +a(e 1oo(ean 6a=y (oadin, vie' are not rendered on initia( &a,e (oad to i"&rove
&er+or"ance and intead (a=i(y (oaded on de"and 'hen there are
+irt navi,ated to.
)ettin& Started with the Pa&e
!(eae ee ection 10.1 !a,e +or the ua,e and "ore in+or"ation.
544
1:.#.6 "an&eSlider
Ran,eS(ider i a ,rou&in, co"&onent +or dua( (ider to create a ran,e e(ection.
In%o
9a, range)lider
*o"&onent *(a org.primefaces.mo&ile.component.rangeslider.ange)lider
*o"&onent 9y&e org.primefaces.mo&ile.ange)lider
Renderer 9y&e org.primefaces.mo&ile.component.ange)lider
Renderer *(a org.primefaces.mo&ile.component.rangeslider.ange)lider
Attributes
in a bac3in, bean
hi,h(i,ht +a(e 1oo(ean .i,h(i,ht the va(ue ran,e 'hen enab(ed.
)ettin& Started with the "an&eSlider
Ran,eS(ider need t'o (ider a chi(drenE +irt (ider i +or the tart o+ ran,e and econd +or the end.
<pm:range8lider>
<pm:input8lider value'(./-ac2ing@iew.start0(/>
<pm:input8lider value'(./-ac2ing@iew.end0(/>
</pm:range8lider>
545
1:.#.7 Switch
S'itch i an in&ut co"&onent to e(ect a boo(ean va(ue.
In%o
9a, s0itc"
*o"&onent *(a org.primefaces.mo&ile.component.uis0itc".-.)0itc"
*o"&onent 9y&e org.primefaces.mo&ile.-.)0itc"
Renderer 9y&e org.primefaces.mo&ile.component.-.)0itc"enderer
Renderer *(a org.primefaces.mo&ile.component.uis0itc".-.)0itc"enderer
Attributes
be rendered.
converter nu(( 7b/ect An e( e0&reion or a (itera( te0t that de+ine a
converter +or the co"&onent. When itZ an E6
e0&reionE itZ reo(ved to a converter intance. In
cae itZ a tatic te0tE it "ut re+er to a converter id.
co"&onent.
va(idator nu(( 7b/ect A "ethod bindin, e0&reion that re+er to a
"ethod va(idation, the in&ut.
va(ue*han,e6itener nu(( 7b/ect A "ethod bindin, e0&reion that re+er to a
"ethod +or hand(in, a va(uechan,eevent.
546
+ai(.
on6abe( on Inte,er 8ini"u" va(ue o+ the (ider.
o++6abe( o++ Inte,er 8a0i"u" va(ue o+ the (ider.
diab(ed +a(e 1oo(ean Diab(e or enab(e the 'itch.
onchan,e +a(e Strin, *(ient ide ca((bac3 to e0ecute on chan,e event.
)ettin& Started with the Switch
>a(ue o+ 'itch hou(d be a boo(ean &ro&ertyE i+ the va(ue i +a(e o++6abe( 'ou(d be di&(ayed and
on6abe( 'ou(d be ued other'ie.
<pm:switch value'(./-ac2ing@iew.-oolean#roperty0( />
547
1*.4 0ender1it
In addition to the "obi(e co"&onentE variou core co"&onent have been enhanced 'ith "obi(e
renderer o that a"e co"&onent can be o&ti"i=ed +or a "obi(e bro'er. Since ua,e i a"e in
de3to& and "obi(e environ"entE re+er to cha&ter ) +or docu"entation about thee co"&onent.
1*.4.1 AccordionPanel
1*.4.2 AutoCo'plete
1*.4.3 Button
548
1:.'.' $alendar
1*.4.5 DataLi)t
1:.'.5 Dialo&
1:.'.6 File4pload
549
1:.'.7 )rowl
1:.'.8 Input1e-t
1:.'.1: Input1e-tarea
1:.'.11 *in+
1:.'.12 Menu
1:.'.1# Panel
550
1:.'.1' Panel)rid
1:.'.13 Select.oolean$hec+bo-
1:.'.15 Select$hec+bo-Menu
1:.'.16 SelectMany.utton
1:.'.17 SelectMany$hec+bo-
1:.'.18 Select;ne.utton
1:.'.2: Select;neMenu
1:.'.21 Select;ne"adio
1:.'.22 1abMenu
551
1:.'.2' 1ab<iew
1:.'.23 1oolbar
552
1*.5 2he'e)
8obi(e the"in, i i"i(ar to the core the"in, docu"ented at cha&ter 2. 8ain di++erence i the
'atch conce&t o+ "obi(e the"e 'here one the"e can contain "u(ti&(e 'atche. De+au(t the"e
ha t'o 'atche a and &. A 'atch can be a&&(ied uin, 'atch attribute 'hen avai(ab(e.
<pm:header title'(4eader( swatch'(-(></pm:header>
$ustom 1heme
9here i a "obi(e the"ero((er a&&(ication to create a cuto" the"e.
http://themeroller.,Buerymo-ile.com
A+ter creatin, the the"e and do'n(oadin, it a a =i& +i(eE a /ar +i(e ha to be created to inta(( the
the"e 'ith the a"e +o(der tructure a a de3to& the"e.
- jar
- META-INF
- resources
- primefaces-mytheme
B theme.css
B images
1@ 9he the"e &ac3a,e do'n(oaded +ro" 9he"eRo((er 'i(( have a the"ena"e.c +i(e and i"a,e
+o(der. E0tract the content o+ the &ac3a,e and rena"e themename.css to theme.css.
%@ I"a,e re+erence in your the"e.c "ut a(o be converted to an e0&reion that AS# reource
(oadin, can undertandE e0a"&(e 'ou(d beK
ur(?Ii"a,eQuiBb,Lhi,h(i,htBhardL100L+9+9+9L10100.&n,I@
hou(d beK
ur(?IXVreourceÒ&ri"e+aceB"ythe"eNi"a,eQuiBb,Lhi,h(i,htBhardL100L+9+9+9L10100.&n,OaWI@
7nce the /ar o+ your the"e i in c(a&athE you can enab(e the the"e by the +o((o'in, con+i,uration.
<conte&t3param>
<param3name>primefaces.mo-ile.!4$5$</param3name>
<param3value>mytheme</param3value>
</conte&t3param>
&ara"Bva(ue can be an E6 e0&reion a 'e(( to i"&(e"ent dyna"ic the"in,.
553
1*. 3ra'e4or.
In addition to the UI co"&onentE !#8 &rovide ea"(e inte,ration 'ith /Duery 8obi(e.
1*..1 Ajax 5pdate)
!(ain /Duery 8obi(e UI e(e"ent ue &ro,reive enhance"ent a&&roach that run once on &a,e
(oadE thi brea3 AS# a/a0 u&date ince the u&dated &art cannot be enhanced a,ain. !#8 ta3e care
o+ thi &rob(e" under the hood.
A an e0a"&(eE the &(ain /Cuery "obi(e data(it and in&utte0t 'i(( (oe a(( ty(in, and +unctiona(ity
'hen u&dated 'ith tandard a/a0 co""andbutton 'herea !#8 co""and1utton 'i(( &ro&er(y
u&date the data(it and in&utte0t.
<h:command=utton value'(8tandard(>
<f:a,a& render'(panel*( />
</h:command=utton>

<p:command=utton value'(#65( update'(panelA( icon'(ui3icon3refresh(/>

<h:panelIroup id'(panel*(>
<ul data3role'(listview( data3inset'(true(>
<li><a href'(.(>Item *</a></li>
<li><a href'(.(>Item A</a></li>
<li><a href'(.(>Item )</a></li>
</ul>

<h:input!e&t />
</h:panelIroup>

<p:output#anel id'(panelA(>
<p:menu stylelass'(ui3listview3inset ui3corner3all(>
<p:menuitem value'(Item*( url'(.( />
<p:menuitem value'(ItemA( url'(.( />
<p:menuitem value'(Item)( url'(.( />
</p:menu>

<p:input!e&t />
</p:output#anel>
1*..2 Pa)) 2hrou%h Ele'ent)
/D8 i data attribute drivenE than3 to AS# %.%O dyna"ic attribute u&&ortE !ri"e#ace
*o"&onent can have "obi(e &eci+ic o&tion eai(y. E0a"&(e be(o' add inet ettin, to a data(it.
<p:data7ist value'(./ring=ean.players0( var'(player( pt:data3inset'(true(>
//content
</p:data7ist>
<ote that &t i the tandard ta,(ibK $mlns7ptJ4http7AA$mlns.#cp.orgA#sfApassthrough4. #or the +u(( (it
o+ avai(ab(e data attributeE conu(t the /Duery 8obi(e docu"entation.
554
1*..3 La67 Pa%e)
#or a "obi(e device 'ith band'ith concernE (oadin, a(( the &a,e in a"e 0ht"( at once in an
ea,er +ahion i not o&ti"a( and "i,ht caue &er+or"ance iue i+ the &a,e i=e i bi,. !#8
u&&ort (a=y (oadin, &a,e 'here a &a,e content i not rendered at +irt but (oaded 'ith a/a0 /ut
be+ore acceed +or the +irt ti"e. 6a=y (oadin, i diab(ed and activated by ettin, la/y o&tion on
&a,e co"&onent.
<!DO!"#$ html>
<h:head></h:head>
<h:-ody>
<pm:page id'(main(>
<pm:header title'(5ain #age(></pm:header>
<pm:content>
<p:lin2 outcome'(pm:second( value'(Io( />
</pm:content>
</pm:page>
<pm:page id'(second( laOy'(true(>
<pm:header title'(8econd #age(></pm:header>
<pm:content>
//7aOy loaded content
</pm:content>
</pm:page>
</h:-ody>
</html>
At +irt &a,e (oadE econd &a,e content are not avai(ab(e on &a,eE c(ic3in, the (in3 +irt "a3e an
a/a0 reCuet to +etch the contentE create the UI and then +ina((y navi,ate to it.
1*..4 2ouch E,ent)
9ouch event (i3e 'i&e are enab(ed in o"e co"&onent. In +o((o'in,E ite" in the (it can be
re"oved by swipeleft or swiperight and detai( i di&(ayed 'ith taphold.
<h:form id'(form(>
<p:growl id'(msgs( showDetail'(true( />
<p:data7ist value'(./ta-le=ean.cars8mall0( var'(car( pt:data3inset'(true(>
<p:a,a& event'(swipeleft( listener'(./ta-le=ean.swipear0(
update'(:form:msgs Zthis(/>
<p:a,a& event'(swiperight( listener'(./ta-le=ean.swipear0(
update'(:form:msgs Zthis(/>
<p:a,a& event'(taphold( listener'(./ta-le=ean.onCow8elect0(
update'(:form:msgs(/>
<h:output!e&t value'(./car.manufacturer0 3 ./car.color0( />
</p:data7ist>
</h:form>
555
pu-lic void onCow8elect98elect$vent event: /
6aces5essage msg ' new 6aces5essage9(ar 8elected(H
99ar: event.getO-,ect9::.get5odel9::;
0

pu-lic void swipear98wipe$vent event: /
ar car ' 9ar: event.getData9:;
cars8mall.remove9car:;
6acesonte&t.geturrentInstance9:.add5essage9nullH
new 6aces5essage96aces5essage.8$@$CI!"LIJ6OH
(ar 8wiped(H (Cemoved: ( > car.get5odel9:::;
0

Section 10.- and 10.5 contain u&&orted "obi(e event +or a co"&onent 'hen avai(ab(e.
556
11. 4tilities
11.1 "eFuest$onte-t
ReCuet*onte0t i a i"&(e uti(ity that &rovide ue+u( ,oodie uch a addin, &ara"eter to a/a0
ca((bac3 +unction. ReCuet*onte0t i avai(ab(e in both a/a0 and nonBa/a0 reCuet.
ReCuet*onte0t can be obtained i"i(ar(y to the #ace*onte0t.
CeBuestonte&t reBuestonte&t ' CeBuestonte&t.geturrentInstance9:;
"eFuest$onte-t API
!et"od Description
iA/a0ReCuet?@ Return a boo(ean va(ue i+ current reCuet i a
!ri"e#ace a/a0 reCuet.
add*a((1ac3!ara"?Strin, na"eE 7b/ect va(ue@ Add &ara"eter to a/a0 ca((bac3 (i3e onco"&(ete.
u&date?Strin, c(ientId@K S&eci+ie co"&onent?@ to u&date at runti"e.
e0ecute?Strin, cri&t@ E0ecute cri&t a+ter a/a0 reCuet co"&(ete or on &a,e
(oad.
cro((9o?Strin, c(ientId@ Scro(( to the co"&onent 'ith ,iven c(ientId a+ter a/a0
reCuet co"&(ete.
$allbac+ Parameters
9here "ay be cae 'here you need va(ue +ro" bac3in, bean in a/a0 ca((bac3. *a((bac3
&ara"eter are eria(i=ed to AS7< and &rovided a an ar,u"ent in a/a0 ca((bac3 +or thi.
<p:command=utton action7istener'(./-ean.validate0(
oncomplete'(handleomplete9&hrH statusH args:( />
pu-lic void validate9: /
//is@alid ' calculate is@alid
reBuestonte&t.addall-ac2#aram9(is@alid(H true or false:;
0
is2alid &ara"eter 'i(( be avai(ab(e in hand(e*o"&(ete ca((bac3 aK
function handleomplete9&hrH statusH args: /
var is@alid ' args.is@alid;
0
</script>
Mou can add a "any ca((bac3 &ara"eter a you 'ant 'ith add*a((bac3!ara" A!I. Each &ara"eter
i eria(i=ed a AS7< and acceib(e throu,h ar, &ara"eter o &o/o are a(o u&&orted /ut (i3e
557
&ri"itive va(ue. #o((o'in, e0a"&(e end a &o/o ca((ed (ser that ha &ro&ertie (i3e +irtna"e and
(atna"e to the c(ient in addition to is2alid boo(ean va(ue.
pu-lic void validate9: /
//is@alid ' calculate is@alid
reBuestonte&t.addall-ac2#aram9(is@alid(H true or false:;
reBuestonte&t.addall-ac2#aram9(user(H user:;
0
function handleomplete9&hrH statusH args: /
var firstname ' args.user.firstname;
var lastname ' args.user.lastname;
0
</script>
1y de+au(t validationFailed ca((bac3 &ara"eter i added i"&(icit(y i+ va(idation +ai(.
"untime 4pdates
*onditiona( UI u&date i Cuite co""on 'here di++erent &art o+ the &a,e need to be u&dated baed
on a dyna"ic condition. In thi caeE it i not e++icient to ue dec(arative u&date and de+ined a((
u&date area ince thi 'i(( caue unnceary u&date.9here "ay be cae 'here you need to de+ine
'hich co"&onent?@ to u&date at runti"e rather than &eci+yin, it dec(arative(y. update "ethod i
added to hand(e thi cae. In e0a"&(e be(o'E button action6itener decide 'hich &art o+ the &a,e to
u&date onBtheB+(y.
<p:command=utton value'(8ave( action7istener'(./-ean.save0( />
<p:panel id'(panel(> ... </p:panel>
<p:data!a-le id'(ta-le(> ... </p:panel>
//-oolean outcome ' ...
if9outcome:
reBuestonte&t.update9(panel(:;
else
reBuestonte&t.update9(ta-le(:;
0
When the ave button i c(ic3edE de&endin, on the outco"eE you can either con+i,ure the datatab(e
or the &ane( to be u&dated 'ith a/a0 re&one.
/-ecute !aascript
ReCuet*onte0t &rovide a 'ay to e0ecute /avacri&t 'hen the a/a0 reCuet co"&(eteE thi
a&&roach i eaier co"&ared to &ain, ca((bac3 &ara" and e0ecute conditiona( /avacri&t.
E0a"&(e be(o' hide the dia(o, 'hen a/a0 reCuet co"&(eteK
558
reBuestonte&t.e&ecute9dialog.hide9::;
0
559
11.2 /* Functions
!ri"e#ace &rovide bui(tBin E6 e0tenion that are he(&er to co""on ue cae.
$ommon Functions
+unction Description
co"&onent?OidO@ Return c(ientId o+ the co"&onent 'ith &rovided erver id &ara"eter. 9hi +unction
i ue+u( i+ you need to 'or3 'ith /avacri&t.
'id,et>ar?OidO@ !rovide the 'id,et>ar o+ a co"&onent in !#?OO@ +or"at.
*o"&onent
<h:form id'(form*(>
<h:input!e&t id'(name( />
</h:form>
//./p:component9!name:0 returns !form*:name
Wid,et>ar
<p:dialog id'(dlg(>
//contents
</p:dialog>
<p:command=utton type'(-utton( value'(8how( onclic2'(./p:widget@ar9!dlg:0.show9:( />
Pa&e Authori9ation
Authori=ation +unction ue .tt&Serv(etReCuet A!I +or the bac3end in+or"ation.
+unction Description
i+Granted?Strin, ro(e@ Return true i+ uer ha the ,iven ro(eE e(e +a(e.
i+A((Granted?Strin, ro(e@ Return true i+ uer ha a(( o+ the ,iven ro(eE e(e +a(e.
i+AnyGranted?Strin, ro(e@ Return true i+ uer ha any o+ the ,iven ro(eE e(e +a(e.
i+<otGranted?Strin, ro(e@ Return true i+ uer ha none o+ the ,iven ro(eE e(e +a(e.
re"oteUer?@ Return the na"e o+ the (o,,ed in uer.
uer!rinci&a(?@ Return the &rinci&a( intance o+ the (o,,ed in uer.
<p:command=utton rendered'(./p:ifIranted9?CO7$L<D5IJ?:0( />
<h:input!e&t disa-led'(./p:ifIranted9?CO7$LIK$8!?:0( />
<p:input5as2 rendered'(./p:if<llIranted9?CO7$L$DI!OCH CO7$LC$<D$C?:0( />
560
11.# /-ception (andler
!ri"e#ace &rovide a bui(tBin e0ce&tion hand(er to ta3e care o+ e0ce&tion in a/a0 and nonBa/a0
reCuet eai(y.
$on%i&uration
E0ce&tion.and(er and an E(Reo(ver con+i,ured i reCuired in +ace con+i,uration +i(e.
<application>
<el3resolver>
org.primefaces.application.e&ceptionhandler.#rime$&ception4andler$7Cesolver
</el3resolver>
</application>
<factory>
<e&ception3handler3factory>
org.primefaces.application.e&ceptionhandler.#rime$&ception4andler6actory
</e&ception3handler3factory>
</factory>
/rror Pa&es
E0ce&tion.and(er i inte,rated 'ith errorB&a,e "echani" o+ Serv(et A!I. At a&&(ication tartu&E
!ri"e#ace &are the error &a,e and ue thi in+or"ation to +ind the a&&ro&riate &a,e to redirect
to baed on the e0ce&tion ty&e. .ere i an e0a"&(e 'eb.0"( con+i,uration 'ith a ,eneric &a,e +or
e0ce&tion and a &ecia( &a,e +or >ie'E0&iredE0ce&tion ty&e.
<M&ml version'(*.0( encoding'(K!63G(M>
<we-3app version'(A.5(
&mlns'(http://,ava.sun.com/&ml/ns/,avaee(
&mlns:&si'(http://www.w).org/A00*/N578chema3instance(
&si:schema7ocation'(http://,ava.sun.com/&ml/ns/,avaee
http://,ava.sun.com/&ml/ns/,avaee/we-3appLAL5.&sd( >

<!33 Other application configuration 33>

<error3page>
<e&ception3type>,ava.lang.!hrowa-le</e&ception3type>
<location>/ui/error/error.,sf</location>
</error3page>
<error3page>
<e&ception3type>,ava&.faces.application.@iew$&pired$&ception</e&ception3type>
<location>/ui/error/view$&pired.,sf</location>
</error3page>

</we-3app>
561
/-ception In%ormation
In the error &a,eE in+or"ation about the e0ce&tion i &rovided via the &+E0ce&tion.and(er E6
3ey'ord. .ere i the (it o+ e0&oed &ro&ertie.
B e0ce&tionN 9hro'ab(e intance.
B ty&eN 9y&e o+ the e0ce&tion.
B "ea,eN E0ce&tion "ea,eN
B tac39raceN An array o+ /ava.(an,.Stac39raceE(e"ent intance.
B +or"attedStac39raceN Stac3 trace a &reentab(e trin,.
B ti"eta"&N 9i"eta"& a date.
B +or"atted9i"eta"&N 9i"eta"& a &reentab(e trin,.
In error &a,eE e0ce&tion "etadata i acceed uin, E6K
<h:output!e&t value'(5essage:./pf$&ception4andler.message0( />
<h:output!e&t value'(./pf$&ception4andler.formatted8tac2!race0( escape'(false( />
A,a- /-ception (andler $omponent
A &ecia(i=ed e0ce&tion hand(er co"&onent &rovide a 'ay to e0ecute ca((bac3 on c(ient ideE
u&date other co"&onent on the a"e &a,e. 9hi i Cuite ue+u( in cae you donOt 'ant to create a
e&arate error &a,e. #o((o'in, e0a"&(e ho' the e0ce&tion in a dia(o, on the a"e &a,e.
<p:a,a&$&ception4andler type'(,ava&.faces.application.@iew$&pired$&ception(
update'(e&ceptionDialog( one&ception'(#69?e&ceptionDialog?:.show9:;( />
<p:dialog id'(e&ceptionDialog( header'($&ception: ./pf$&ception4andler.type0
occured!( widget@ar'(e&ceptionDialog( height'(500p&(>
5essage: ./pf$&ception4andler.message0 <-r/>
8tac2!race: <h:output!e&t value'(./pf$&ception4andler.formatted8tac2!race0(
escape'(false( />
<p:-utton onclic2'(document.location.href ' document.location.href;(
value'(Ceload!(/>
</p:dialog>
Idea( (ocation +or &Na/a0E0ce&tion.and(er co"&onent i the +ace(et te"&(ate o that it ,et
inc(uded in every &a,e. Re+er to co"&onent docu"entation o+ &Na/a0E0ce&tion.and(er +or the
avai(ab(e attribute.
"ender "esponse /-ceptions
9o u&&ort e0ce&tion hand(in, in the +E='E+>+ESP,=SE &haeE itO reCuired to et the
#ava$.faces.FACE&ETS>)(FFE+>S*KE &ara"eter. 7ther'ie you 'i(( &robab(y ee a
Serv(etE0ce&tion 'ith IRe&one a(ready co""ittedI "ea,e.
562
11.' .ean<alidation 1rans%ormation
Since AavaEE 4E va(idation "etadata i a(ready avai(ab(e +or "any co"&onent via the va(ue
re+erence and 1ean>a(idation ?e.,. b<ot<u((E bSi=e@. 9he AS# I"&(e"entation ue thi
in+or"ation +or erver ide va(idation and !ri"e#ace enhance thi +eature 'ith c(ient ide
va(idation +ra"e'or3.
!ri"e#ace "a3e ue o+ thee "etadata by tran+or"in, the" to co"&onent and ht"( attribute.
#or e0a"&(e o"eti"e itZ reCuired to "anua((y "aintain the reCuired or "a0(en,th attribute +or
in&ut co"&onent. 9he reCuired attribute a(o contro( the behavior o+ &Nout&ut6abe( to ho' or
hide the reCuired indicator ?J@ 'herea the ma$length attribute i ued to (i"it the character on
in&ut +ie(d. 1ean>a(idation tran+or"ation +eature enab(e avoidin, "anua((y "aintainin, thee
attribute any"ore by i"&(ici(ity hand(in, the" behind the cene.
$on%i&uration
9o tart 'ithE tran+or"ation hou(d be enab(ed.
<conte&t3param>;
<param3name>primefaces.!C<J86OC5L5$!<D<!<</param3name>
<param3value>true</param3value>
</conte&t3param>
4sa&e
De+ine contraint at bean (eve(.
ZJotJull
Z5a&9)0:
private 8tring firstname;
*o"&onent at vie' doe not have any contraintK
<p:input!e&t value'(./-ean.firstname0( />
#ina( out&ut ha ht"( "a0(en,th attribute ,enerated +ro" the b8a0 annotationE a(o the co"&onent
intance ha reCuired enab(ed.
<input type'(te&t( ma&length'()0( a />
563
11.3 PrimeFaces *ocales
*o"&onent "ay reCuire tran(ation and other ettin, baed on di++erent (oca(e. 9hi i hand(ed
'ith a c(ient ide a&i ca((ed !ri"e#ace 6oca(e. A c(ient ide (oca(e i baica((y a /avacri&t ob/ect
'ith variou ettin,E enLUS i the de+au(t (oca(e &rovided out o+ the bo0. In cae you need to
u&&ort another (oca(eE ettin, hou(d be e0tended 'ith the ne' in+or"ation.
A 'i3i &a,e i avai(ab(e +or uer contributed ettin,E the (it i co""unity driven and a ,ood
tartin, &oint a(thou,h it "i,ht be inco"&(ete.
https://code.google.com/p/primefaces/wi2i/#rime6aces7ocales
De%ault *ocale
.ere i the (it o+ a(( 3eyBva(ue &air +or enLUS (oca(e that i &rovided by !ri"e#ace. Date9i"e
re(ated &ro&ertie are uti(i=ed by co"&onent uch a ca(endar and chedu(e. I+ you are uin, *(ient
Side >a(idationE "ea,e &ro&erty i ued a the bund(e +or the (oca(e.
V
closeTe$tN O*(oeOE
prevTe$tN O!reviouOE
ne$tTe$tN O<e0tOE
mont"NamesN ÒAanuaryOE O#ebruaryOE O8archOE OA&ri(OE O8ayOE OAuneOE OAu(yOE OAu,utOE OSe&te"berOE
O7ctoberOE O<ove"berOE ODece"berO aE
mont"Names)"ortN ÒAanOE O#ebOE O8arOE OA&rOE O8ayOE OAunOE OAu(OE OAu,OE OSe&OE O7ctOE O<ovOE ODecO aE
dayNamesN ÒSundayOE O8ondayOE O9uedayOE OWednedayOE O9hurdayOE O#ridayOE OSaturdayOaE
dayNames)"ortN ÒSunOE O8onOE O9ueOE OWedOE O9ueOE O#riOE OSatOaE
dayNames!inN ÒSOE O8OE O9OE OW OE O9OE O# OE OSOaE
0ee,(eaderN OWee3OE
firstDayN 0E
isT*N +a(eE
s"o0!ont"After:earN +a(eE
year)uffi$NOOE
time6nlyTitleN O7n(y 9i"eOE
timeTe$tN O9i"eOE
"ourTe$tN O9i"eOE
minuteTe$tN O8inuteOE
secondTe$tN OSecondOE
currentTe$tN O*urrent DateOE
ampmN +a(eE
mont"N O8onthOE
0ee,N O'ee3OE
dayN ODayOE
allDayTe$tN OA(( DayOE
messagesN V
;java$.faces.component.-..nput.'<-.'D;N OV0WN >a(idation ErrorN >a(ue i reCuired.OE
;java$.faces.converter..nteger#onverter..NT'/';N OV%WN ]OV0W]O "ut be a nu"ber
conitin, o+ one or "ore di,it.OE
;java$.faces.converter..nteger#onverter..NT'/'=detail;N OV%WN ]OV0W]O "ut be a nu"ber
bet'een B%1-5-2)4-2 and %1-5-2)4-5 E0a"&(eN V1WOE
564
;java$.faces.converter.Dou&le#onverter.D6-%*';N OV%WN ]OV0W]O "ut be a nu"ber
;java$.faces.converter.Dou&le#onverter.D6-%*'=detail;N OV%WN ]OV0W]O "ut be a nu"ber
bet'een -.9EB)%- and 1.59549)1)-24%)155E)02 E0a"&(eN V1WOE
;java$.faces.converter.%igDecimal#onverter.D'#.!A*;N OV%WN ]OV0W]O "ut be a i,ned
deci"a( nu"ber.OE
;java$.faces.converter.%igDecimal#onverter.D'#.!A*=detail;N OV%WN ]OV0W]O "ut be a
i,ned deci"a( nu"ber conitin, o+ =ero or "ore di,itE that "ay be +o((o'ed by a deci"a( &oint
and +raction. E0a"&(eN V1WOE
;java$.faces.converter.%ig.nteger#onverter.%./.NT'/';N OV%WN ]OV0W]O "ut be a nu"ber
;java$.faces.converter.%ig.nteger#onverter.%./.NT'/'=detail;N OV%WN ]OV0W]O "ut be a
nu"ber conitin, o+ one or "ore di,it. E0a"&(eN V1WOE
;java$.faces.converter.%yte#onverter.%:T';N OV%WN ]OV0W]O "ut be a nu"ber bet'een 0 and
%55.OE
;java$.faces.converter.%yte#onverter.%:T'=detail;N OV%WN ]OV0W]O "ut be a nu"ber bet'een
0 and %55. E0a"&(eN V1WOE
;java$.faces.converter.#"aracter#onverter.#(AA#T';N OV1WN ]OV0W]O "ut be a va(id
character.OE
;java$.faces.converter.#"aracter#onverter.#(AA#T'=detail;N OV1WN ]OV0W]O "ut be a
va(id AS*II character.OE
;java$.faces.converter.)"ort#onverter.)(6T;N OV%WN ]OV0W]O "ut be a nu"ber conitin, o+
one or "ore di,it.OE
;java$.faces.converter.)"ort#onverter.)(6T=detail;N OV%WN ]OV0W]O "ut be a nu"ber
bet'een B)%542 and )%545 E0a"&(eN V1WOE
;java$.faces.converter.%oolean#onverter.%66*'AN;N OV1WN ]OV0W]O "ut be ]Otrue]O
or ]O+a(e]OOE
;java$.faces.converter.%oolean#onverter.%66*'AN=detail;N OV1WN ]OV0W]O "ut be ]Otrue]O or
]O+a(e]O. Any va(ue other than ]Otrue]O 'i(( eva(uate to ]O+a(e]O.OE
;java$.faces.validator.*ongangeValidator.!A>.!-!;N OV1WN >a(idation ErrorN >a(ue i
,reater than a((o'ab(e "a0i"u" o+ ]OV0W]OOE
;java$.faces.validator.*ongangeValidator.!.N.!-!;N OV1WN >a(idation ErrorN >a(ue i
(e than a((o'ab(e "ini"u" o+ ]OV0W]OOE
;java$.faces.validator.*ongangeValidator.N6T=.N=AN/';N OV%WN >a(idation ErrorN
S&eci+ied attribute i not bet'een the e0&ected va(ue o+ V0W and V1W.OE
O/ava0.+ace.va(idator.6on,Ran,e>a(idator.9M!EPV0WON O>a(idation ErrorN >a(ue i not o+ the
correct ty&e.OE
;java$.faces.validator.Dou&leangeValidator.!A>.!-!;N OV1WN >a(idation ErrorN >a(ue i
;java$.faces.validator.Dou&leangeValidator.!.N.!-!;N OV1WN >a(idation ErrorN >a(ue i
(e than a((o'ab(e "ini"u" o+ ]OV0W]OOE
;java$.faces.validator.Dou&leangeValidator.N6T=.N=AN/';N OV%WN >a(idation ErrorN
S&eci+ied attribute i not bet'een the e0&ected va(ue o+ V0W and V1WOE
;java$.faces.validator.Dou&leangeValidator.T:P'?{@};N O>a(idation ErrorN >a(ue i not o+
the correct ty&eOE
;java$.faces.converter.+loat#onverter.+*6AT;N OV%WN ]OV0W]O "ut be a nu"ber conitin, o+
one or "ore di,it.OE
;java$.faces.converter.+loat#onverter.+*6AT=detail;N OV%WN ]OV0W]O "ut be a nu"ber
bet'een 1.-EB-5 and ).-0%2%)5E)2 E0a"&(eN V1WOE
;java$.faces.converter.DateTime#onverter.DAT';N OV%WN ]OV0W]O cou(d not be undertood a a
date.OE
565
;java$.faces.converter.DateTime#onverter.DAT'=detail;N OV%WN ]OV0W]O cou(d not be
undertood a a date. E0a"&(eN V1WOE
;java$.faces.converter.DateTime#onverter.T.!';N OV%WN ]OV0W]O cou(d not be undertood a a
ti"e.OE
;java$.faces.converter.DateTime#onverter.T.!'=detail;N OV%WN ]OV0W]O cou(d not be
undertood a a ti"e. E0a"&(eN V1WOE
;java$.faces.converter.DateTime#onverter.DAT'T.!';N OV%WN ]OV0W]O cou(d not be
undertood a a date and ti"e.OE
;java$.faces.converter.DateTime#onverter.DAT'T.!'=detail;N OV%WN ]OV0W]O cou(d not be
undertood a a date and ti"e. E0a"&(eN V1WOE
;java$.faces.converter.DateTime#onverter.PATT'N=T:P';N OV1WN A ]O&attern]O or ]Oty&e]O
attribute "ut be &eci+ied to convert the va(ue ]OV0W]OOE
;java$.faces.converter.Num&er#onverter.#-'N#:;N OV%WN ]OV0W]O cou(d not be
undertood a a currency va(ue.OE
;java$.faces.converter.Num&er#onverter.#-'N#:=detail;N OV%WN ]OV0W]O cou(d not be
undertood a a currency va(ue. E0a"&(eN V1WOE
;java$.faces.converter.Num&er#onverter.P'#'NT;N OV%WN ]OV0W]O cou(d not be undertood
a a &ercenta,e.OE
;java$.faces.converter.Num&er#onverter.P'#'NT=detail;N OV%WN ]OV0W]O cou(d not be
undertood a a &ercenta,e. E0a"&(eN V1WOE
;java$.faces.converter.Num&er#onverter.N-!%';N OV%WN ]OV0W]O cou(d not be undertood
a a date.OE
;java$.faces.converter.Num&er#onverter.N-!%'=detail;N OV%WN ]OV0W]O i not a nu"ber.
E0a"&(eN V1WOE
;java$.faces.converter.Num&er#onverter.PATT'N;N OV%WN ]OV0W]O i not a nu"ber &attern.OE
;java$.faces.converter.Num&er#onverter.PATT'N=detail;N OV%WN ]OV0W]O i not a nu"ber
&attern. E0a"&(eN V1WOE
;java$.faces.validator.*engt"Validator.!.N.!-!;N OV1WN >a(idation ErrorN 6en,th i (e
than a((o'ab(e "ini"u" o+ ]OV0W]OOE
;java$.faces.validator.*engt"Validator.!A>.!-!;N OV1WN >a(idation ErrorN 6en,th i
;java$.faces.validator.ege$Validator.PATT'N=N6T=)'T;N ORe,e0 &attern "ut be et.OE
;java$.faces.validator.ege$Validator.PATT'N=N6T=)'T=detail;N ORe,e0 &attern "ut
be et to nonBe"&ty va(ue.OE
;java$.faces.validator.ege$Validator.N6T=!AT#('D;N ORe,e0 !attern not "atchedOE
;java$.faces.validator.ege$Validator.N6T=!AT#('D=detail;N ORe,e0 &attern o+ ]OV0W]O
not "atchedOE
;java$.faces.validator.ege$Validator.!AT#(='>#'PT.6N;N OError in re,u(ar
e0&reion.OE
;java$.faces.validator.ege$Validator.!AT#(='>#'PT.6N=detail;N OError in re,u(ar
e0&reionE ]OV0W]OO
W
W
4sa&e
9o add another (oca(e to the A!IE +irt create the (oca(e ob/ect +irt 'ith ettin, and ai,n it a a
&ro&erty o+ !ri"e#ace.(oca(e /avacri&t ob/ect uch aK
PrimeFaces.localesC?de?E J FAAsettingsG
It i u,,eted to &ut thi code in a /avacri&t +i(e and inc(ude the +i(e into your &a,e.
566
12. Portlets
!ri"e#ace u&&ort &ort(et environ"ent baed on AS# % and !ort(et % A!I. A &ort(et brid,e i
neceary to run a AS# a&&(ication a a &ort(et and 'e u,,et 6i+eray#ace brid,e a the
i"&(e"entation. 1oth tea" 'or3 to,ether ti"e to ti"e to "a3e ure !ri"e#ace run 'e(( on
(i+eray. A 3ic3tart e0a"&(e 'ith neceary con+i,uration i avai(ab(e at 6i+eray#ace De"oK
http://www.liferay.com/community/liferay3pro,ects/liferay3faces/demos
De"o contain a in,(e IAob A&&(icationI &ort(et 'ithin the WAR that de"ontrate evera( o+ the
3ey +eature o+ AS# % and !ri"e#aceK
B Ue the !ri"e#ace S&Nca(endarQT ta, +or a &o&u& date e(ector
B Ue the AS# % S+Na/a0 QT ta, on the &ota( ?=i&@ code +ie(d in order to &rovide the abi(ity to autoB
+i(( +ie(d via A/a0
B Ue the AS# % S+Na/a0 QT ta, on the ho'Qhide co""ent (in3 in order to ho'Qhide the
co""ent +ie(d via A/a0
B 8ode( "ana,edBbean i "ar3ed 'ith the AS# % b>ie'Sco&ed annotation in order to u&&ort a
rich UI 'ith the S+Na/a0 QT ta,
B Ue the AS# % S+Na/a0 QT ta, to ho' navi,ationBru(e e0ecutin, 'ithout +u(( &a,e re+rehe
B #i(e u&(oad ca&abi(itie via ShN+or" encty&ePI"u(ti&artQ+or"BdataIT
B 8ana,edBbean de+ined by "ar3in, !7A7 'ith the AS# % b8ana,ed1ean annotation
B De&endency in/ection o+ "ana,edBbean done via the AS# % b8ana,ed!ro&erty annotation
B Ue the !ri"e#ace &N+i(eU&(oad ta, +or "u(tiB+i(e A/a0Bbaed +i(e u&(oad
B Ue the !ri"e#ace &Ndata9ab(e ta, to (it the u&(oaded +i(e
B Ue the !ri"e#ace &Ncon+ir"Dia(o, ta, to &o&u& a yeQno dia(o, to veri+y +i(e de(etion
567
1#. "i&ht>1o>*e%t
Ri,htB9oB6e+t (an,ua,e u&&ort in hort R96 i &rovided out o+ the bo0 by a ubet o+ !ri"e#ace
co"&onent. Any co"&onent eCui&&ed 'ith dir attribute ha the o++icia( u&&ort and there i a(o a
,(oba( ettin, to 'itch to R96 "ode ,(oba((y.
.ere i an e0a"&(e o+ an R96 Accordion!ane( enab(ed via dir ettin,.
<p:accordion#anel dir'(rtl(>
//ta-s
</p:accordion#anel>
)lobal $on%i&uration
Uin, primefaces.'*+ ,(oba( ettin, to rt( intruct !ri"e#ace R96 a'are co"&onent uch a
datatab(eE accordionE tabvie'E dia(o,E tree to render in R96 "ode.
<conte&t3param>
<param3name>primefaces.DIC</param3name>
<param3value>rtl</param3value>
</conte&t3param>
!ara"eter va(ue can a(o be an E6 e0&reion +or dyna"ic va(ue.
In u&co"in, !ri"e#ace re(eaeE "ore co"&onent 'i(( receive bui(tBin R96 u&&ort. Unti( then i+
the co"&onent you ue doent &rovide itE overridin, c and /avacri&t in your a&&(ication 'ou(d
be the o(ution.
568
1'. ID/ Support
1'.1 0et.eans
<et1ean 5.0H bund(e !ri"e#aceE 'hen creatin, a ne' &ro/ect you can e(ect !ri"e#ace +ro"
co"&onent tabK

*ode co"&(etion i u&&orted by <et1ean 4.9H K
569
!ri"e#ace and <et1ean tea" are in co""unication to dicu the ne0t te& o+ !ri"e#ace
inte,ration in <et1ean at the ti"e o+ 'ritin,.
PrimeFaces $"4D Plu&in
Startin, 'ith <et1ean 2E the IDE &rovide a bui(tBin *RUD &(u,in +or !ri"e#ace out o+ the bo0.
'''.youtube.co"Q'atch$vP5a9#i<0=F#-
9here i a(o another )
rd
&arty &(u,in +or <et1ean ca((ed !ri"e#ace *RUD Generator.
http7AAsourceforge.netApro#ectsAnbpfcrudgenA
1'.2 /clipse
*ode co"&(etion 'or3 out o+ the bo0 +or Ec(i&e 'hen AS# +acet i enab(ed.
570
13. Pro,ect "esources
Documentation
9hi ,uide i the "ain reource +or docu"entationE +or additiona( docu"entation (i3e a&idocE ta,(ib
docE 'i3i and "ore &(eae viitK
http://www.primefaces.org/documentation.html
Support Forum
!ri"e#ace dicuion ta3e &(ace at the u&&ort +oru". #oru" i &ub(ic to everyone and
re,itration i reCuired to do a &ot.
http://forum.primefaces.org
Source $ode
!ri"e#ace ource i at ,oo,(e code ubverion re&oitory.
http://code.google.com/p/primefaces/source/
Issue 1rac+er
!ri"e#ace iue trac3er ue ,oo,(e code iue "ana,e"ent yte". !(eae ue the +oru"
be+orecreatin, an iue intead.
http://code.google.com/p/primefaces/issues/list
WI@I
!ri"e#ace Wi3i i a co""unity driven additiona( docu"entation reource.
http://wi2i.primefaces.org
Showcase
Sho'cae i a ,reat reource a a (ive docu"entation.
http://www.primefaces.org/showcase
Social 0etwor+s
Mou can +o((o' !ri"e#ace on t'itter uin, b&ri"e+ace and /oin the #aceboo3 ,rou& +or ne'
and "ore.
571
15. FA2
A. 1"o develops Prime+acesB
!ri"e#ace i deve(o&ed and "aintained by !ri"e9e3E a o+t'are deve(o&"ent co"&any
&ecia(i=ed in UI o(ution +or AavaEE.
C. (o0 can . get supportB
Su&&ort +oru" i the "ain area to a3 +or he(&E it &ub(ic(y avai(ab(e and +ree re,itration i
reCuired be+ore &otin,. !(eae do not e"ai( the deve(o&er o+ !ri"e#ace direct(y and ue u&&ort
+oru" intead.
D. .s enterprise support availa&leB
MeE enter&rie u&&ort i a(o avai(ab(e. !(eae viit u&&ort &a,e on !ri"e#ace 'ebite +or "ore
in+or"ation.
htt&NQQ'''.&ri"e+ace.or,Qu&&ort
E. 1"ere is t"e source for t"e e$ample demo applicationsB
Source code o+ de"o a&&(ication are in the vn re&oitory o+ !ri"e#ace at Qe0a"&(eQtrun3 +o(der.
Sna&hot bui(d o+ a"&(e are de&(oyed at !ri"e#ace Re&oitory ti"e to ti"e.
F. )ome components li,e c"arts do not 0or, in )afari or #"rome &ut t"ere8s no pro&lem 0it"
+irefo$.
9he co""on reaon i the re&one "i"e9y&e 'hen uin, 'ith !ri"e#ace. Mou need to "a3e
ure re&one9y&e i Ite0tQht"(I. Mou can ue the S+Nvie' content9y&ePIte0tQht"(IT to en+orce thi.
G. 1"at is t"e license of Prime+acesB
!ri"e#ace i +ree to ue and (icened under A&ache 6icene >%E E(ite verion are (icened under
E(ite 6icene.
H. #an . use Prime+aces in a commercial soft0areB
MeE A&ache >% 6icene i a co""ercia( +riend(y (ibrary. !ri"e#ace doe not bund(e any third
&arty o+t'are that con+(ict 'ith A&ache. Sa"e ,oe +or E(ite Re(eae +or E6I9E and !R7 uer.
I. 1"ic" &ro0sers are supported &y Prime+acesB
IE 2B9B10B11E Sa+ariE #ire+o0E *hro"e and 7&era.
572
9.E E<D
573

Primefaces User Guide 5 0

Uploaded by

Document Information

Original Description:

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Primefaces User Guide 5 0

Uploaded by

Copyright:

Available Formats

USER GUIDE

*o"&onent (i3e co""and1utton ha an attribute ?

Enab(e +orceSe(ection i+ you

!rovide a co(u"n 'idth uin,

DataGrid &rovide t'o +acet na"ed

I+ you need +u(( contro( over (it ty&e "ar3u&E et ty&e to

Data6it &rovide t'o +acet na"ed

Sin,(e trin, va(ue (i3e

*o""a e&arated 0 and y coordinate va(ue (i3e

*o""a e&arated &oition va(ue (i3e

At the "o"entE &Nco""and1utton and &Nco""and6in3 u&&ort

You might also like