Programao)Avanada)em)Java)

2#Semestre#2014/15,#Introduo#a#JSF#

Filipe Arajo
filipius@uc.pt
Filipe Amaral
filipemartinsamaral@gmail.com

Typical)JavaServer)Faces)Web)Page)
! A#set#of#namespace#declara?ons#that#declare#the#

JavaServer#Faces#tag#libraries#

! <html#xmlns="hIp://www.w3.org/1999/xhtml"#

xmlns:h="hIp://xmlns.jcp.org/jsf/html"#
xmlns:f="hIp://xmlns.jcp.org/jsf/core">###
! Op?onally,#the#HTML#head#(h:head)#and#body#

(h:body)#tags##

! A#form#tag#(h:form)#that#represents#the#user#input#

components#

3 - JSF

Example)

3 - JSF

HTML)head)and)body)tags)

3 - JSF

page you must use the prefix that you have chosen for the tag library. For example, in
the following web page the form tag must be referenced using the h prefix because the
preceding tag library directive uses the h prefix to distinguish the tags defined in the
HTML tag library:

Adding Components to a Page Using HTML Tag Library Tags

<h:form ...>

The sections Adding Components to a Page Using HTML Tag Library Tags and Using
Core Tags describe how to use the component tags from the JavaServer Faces standard
HTML tag library and the core tags from the JavaServer Faces core tag library.

Tag

Functions

h:inputHidden

Allows a page author to An HTML <input

include a hidden variable type="hidden">
in a page
element

No appearance

h:inputSecret

Allows a user to input a

string without the actual
string appearing in the
field

An HTML <input
type="password">
element

A field that
displays a row of
characters instead
of the actual
string entered

h:inputText

Allows a user to input a

string

An HTML <input
type="text">
element

A field

Appearance

h:inputTextarea

Allows a user to enter a

multiline string

An HTML
<textarea> element

A multirow field

A column in a
table

h:message

Displays a localized
message

An HTML <span> tag A text string

if styles are used

h:messages

Displays localized
messages

A set of HTML
<span> tags if styles
are used

A text string

10.2 Adding Components to a Page Using HTML Tag Library Tags

The)HTML)Tag)Library)

The tags defined by the JavaServer Faces standard HTML tag library represent HTML
form components and other basic HTML elements. These components display data or
accept data from the user. This data is collected as part of a form and is submitted to
the server, usually when the user clicks a button. This section explains how to use each
of the component tags shown in Table 101.
Table 101

Table 101 (Cont.) The Component Tags

Rendered As

The Component Tags

Tag

Functions

h:column

Represents a column of
A column of data in
data in a data component an HTML table

h:commandButton

Submits a form to the

application

An HTML <input
A button
type=value> element
for which the type
value can be
"submit", "reset", or
"image"

h:outputFormat

Displays a formatted
message

Plain text

Plain text

h:commandLink

Links to another page or

location on a page

An HTML <a href>

element

A link

h:outputLabel

An HTML <label>
element

Plain text

h:dataTable

Represents a data
wrapper

An HTML <table>
element

A table that can

be updated
dynamically

Displays a nested
component as a label for
a specified input field

h:outputLink

Links to another page or

location on a page
without generating an
action event

An HTML <a>
element

A link

h:outputText

Displays a line of text

Plain text

Plain text

h:panelGrid

Displays a table

An HTML <table>
element with <tr>
and <td> elements

A table

h:panelGroup

Groups a set of
components under one
parent

A HTML <div> or
<span> element

A row in a table

h:selectBooleanCheck Allows a user to change

box
the value of a Boolean
choice

An HTML <input
type="checkbox">
element

A check box

h:selectManyCheckbox Displays a set of check

boxes from which the
user can select multiple
values

A set of HTML
<input> elements of
type checkbox

A group of check
boxes

h:form

h:graphicImage

Rendered As

Appearance

Represents an input form An HTML <form>

(inner tags of the form
element
receive the data that will
be submitted with the
form)

No appearance

Displays an image

An image

An HTML <img>
element

Adding Components toh:inputFile

a Page Using HTML Tag Library
Tags
Allows
a user to upload a An HTML <input
file

type="file">
element

A field with a
Browse... button

Table 101 (Cont.) The Component Tags

Rendered As

Appearance

h:selectOneListbox
Allows a user to select
10-2 Java Platform, Enterprise Edition The one
Javaitem
EE Tutorial
from a set of
items all displayed at
once

Tag

Functions

An HTML <select>
element

A box

h:selectOneMenu

Allows a user to select

one item from a set of
items

An HTML <select>
element

A menu

h:selectOneRadio

Allows a user to select

one item from a set of
items

An HTML <input
type="radio">
element

A group of
options

3 - JSF

h:selectManyListbox

Allows a user to select

multiple items from a set
of items all displayed at
once

An HTML <select>
element

A box

h:selectManyMenu

Allows a user to select

multiple items from a set
of items

An HTML <select>
element

A menu

The tags correspond to components in the javax.faces.component package. The

components are discussed in more detail in Chapter 12, "Developing with JavaServer
Faces Technology."
The next section explains the important attributes that are common to most
component tags. For each of the components discussed in the following sections,
Writing Bean Properties explains how to write a bean property bound to that
particular component or its value.
For reference information about the tags and their attributes, see the JavaServer Faces
Facelets Tag Library documentation.

10.2.1 Common Component Tag Attributes

Most of the component tags support the attributes shown in Table 102.
Table 102

Common Component Tag Attributes

Attribute

Description

binding

Identifies a bean property and binds the component instance to it.

id

Uniquely identifies the component.

immediate

If set to true, indicates that any events, validation, and conversion associated
with the component should happen when request parameter values are
applied.

rendered

Specifies a condition under which the component should be rendered. If the

condition is not satisfied, the component is not rendered.

style

Specifies a Cascading Style Sheet (CSS) style for the tag.

styleClass

Specifies a CSS class that contains definitions of the styles.

value

Specifies the value of the component in the form of a value expression.

All the tag attributes except id can accept expressions, as defined by the EL, described
in Expression Language.
An attribute such as rendered or value can be set on the page and then modified in
!
Other#tags#that#are#
the backing
bean for the page.

part#of#a#form#

10.2.1.1 The id Attribute

The id attribute is not usually required for a component tag but is used when another
component or a server-side class must refer to the component. If you don't include an
id attribute, the JavaServer Faces implementation automatically generates a

! h:inputFile#

! h:inputHidden#

10-4 Java Platform, Enterprise Edition The Java EE Tutorial

! h:inputSecret#
! h:inputText#
! h:inputTextarea#
! #

3 - JSF

Using JavaServer Faces Technology in Web Pages 10-3

The)h:form)
Tag)

Text)Components)
!

Input#Tags#
!
!
!
!

h:inputHidden#
h:inputSecret#
h:inputText#
h:inputTextarea#

Output#Tags#
!
!
!
!

h:outputFormat#
h:outputLabel#
h:outputLink#
h:outputText#

Input#Tag#AIributes#
!
!
!
!
!
!
!
!
!
!

converter#
converterMessage#
dir#
label#
lang#
required#
requiredMessage#
validator#
validatorMessage#
valueChangeListener#

Rendering a Field with the h:inputText Tag

3 - JSF

Displaying)Components)for)Selecting)
Values)
! h:selectBooleanCheckbox#

! h:selectManyCheckbox##

! h:selectOneRadio#

! h:selectManyListbox##

! h:selectOneMenu#

! h:selectManyMenu##

! h:selectOneListbox#

3 - JSF

h:selectBooleanCheckBox)

3 - JSF

10

h:selectManyCheckBox)

3 - JSF

h:selectManyCheckBox)

11

3 - JSF

12

h:dataTable))

3 - JSF

13

h:dataTable))

3 - JSF

14

Common)Component)Tag)Attributes)
! binding#
! id#
! immediate#
! rendered#
! style#
! styleClass#
! value#
3 - JSF

15

The)immediate)Attribute)
! If#set#to#true,#indicates#that#any#events,#valida?on,#and#

conversion#associated#with#the#component#should#happen#
when#request#parameter#values#are#applied#

Submit

Good for a
Cancel button
3 - JSF

Submit
Immediate

16

Immediate)on)Action)Component)

3 - JSF

Check this: http://www.javacodegeeks.com/2012/01/jsf-and-immediate-attribute-command.html

17

Immediate)on)Input)Components)

3 - JSF

18

Converters)

! Note:#JSF#automa?cally#converts#component#data#when#the#

component#value#binding#type#is#a#primi?ve#type,#
BigDecimal,#or#BigInteger.#For#Date#values,#you#need#to#add#
an#explicit#converter#because#you#can#specify#the#forma`ng#
style#to#convert#to#for#date#and#?me#por?ons#

3 - JSF

19

Converters)
! Perhaps#more#interes?ng:#

3 - JSF

20

Listeners)
! ValuecChange#Listener#

! Ac?on#Listener#

3 - JSF

21

Writing)a)Method)to)Handle)an)Action)
Event)

Using the Standard Validators

value="#{bundle.CartAdd}">
<f:setPropertyActionListener target="#{requestScope.book}"
value="#{book}"/>
</h:commandButton>
</h:column>

The h:commandLink and h:commandButton tags are within an h:dataTable tag, which
iterates over the list of books. The var attribute refers to a single book in the list of
books.

3 - JSF

The object referenced by the var attribute of an h:dataTable tag is in page scope.
However, in this case you need to put this object into request scope so that when the
user activates the commandLink component to go to bookdetails.xhtml or activates the
commandButton component to go to bookcatalog.xhtml, the book data is available to
those pages. Therefore, the f:setPropertyActionListener tag is used to set the
current book object into request scope when the commandLink or commandButton
component is activated.
In the preceding example, the f:setPropertyActionListener tag's value attribute
references the book object. The f:setPropertyActionListener tag's target attribute
references the value expression requestScope.book, which is where the book object
referenced by the value attribute is stored when the commandLink or the
22
commandButton component is activated.

Validators)

11.3 Using the Standard Validators

JavaServer Faces technology provides a set of standard classes and associated tags that
page authors and application developers can use to validate a component's data.
Table 115 lists all the standard validator classes and the tags that allow you to use the
validators from the page.
Table 115

The Validator Classes

Validator Class

Tag

Function

BeanValidator

validateBean

Registers a bean validator for the

component.

DoubleRangeValidator

validateDoubleRange

Checks whether the local value of a

component is within a certain range. The
value must be floating-point or convertible
to floating-point.

LengthValidator

validateLength

Checks whether the length of a

component's local value is within a certain
range. The value must be a
java.lang.String.

LongRangeValidator

validateLongRange

Checks whether the local value of a

component is within a certain range. The
value must be any numeric type or String
that can be converted to a long.

RegexValidator

validateRegex

Checks whether the local value of a

component is a match against a regular
expression from the java.util.regex
package.

RequiredValidator

validateRequired

Ensures that the local value is not empty on

an EditableValueHolder component.

3 - JSF

23

Expression)Language)(EL))
! The#EL#provides#a#way#to#use#simple#expressions#to#

perform#the#following#tasks:#

! Dynamically#read#applica?on#data#stored#in#

JavaBeans#components,#various#data#structures,#and#
implicit#objects
Dynamically#write#data,#such#as#user#input#into#
forms,#to#JavaBeans#components#
Invoke#arbitrary#sta?c#and#public#methods#
Dynamically#perform#arithme?c,#boolean,#and#string#
opera?ons#
Dynamically#construct#collec?on#objects#and#
perform#opera?ons#on#collec?ons#
#

!
!

3 - JSF

24

Immediate)and)Deferred)Evaluation)
Syntax)
! Immediate:#${}#
! The#expression#is#evaluated#and#the#result#returned#
as#soon#as#the#page#is#rst#rendered##
! Deferred:##{}#
! The#technology#using#the#expression#language#can#

use#its#own#machinery#to#evaluate#the#expression#
some?me#later#during#the#page's#lifecycle,#
whenever#it#is#appropriate#to#do#so#

! There#is#no#dierence#in#Facelets#

3 - JSF

25

Value)Expressions)
!

Referencing#Objects#
!

A#topclevel#iden?er#(such#as#
customer#in#the#expression#
customer.name)#can#refer#to#
the#following#objects:##
Lambda#parameters#
EL#variables#
! Managed#beans#
! Implicit#objects#
! Classes#of#sta?c#elds#and#
methods#
!
!

Referencing#Object#Proper?es#or#
Collec?on#Elements#
!
!
!

Referencing#Literals#
!
!
!

${customer.address["street"]}#
${Boolean.FALSE}#
${customer.orders[1]}##
${"literal"}#
${true}#
${57}#

Parametrized#Method#Calls#
!

<h:inputText#
value="#{userNumberBean.userNum
ber('5')}">##

3 - JSF

26

Method)&)Lambda)Expressions,)
Collections)
!

EL#supports#deferred#method#expressions#

Lambda#Expressions#
!
!
!

xc>x+1#
(x,#y)#c>#x#+#y#
((x,y)#c>#x#+#y)(3,4)#
!

Opera?on#on#Collec?on#Objects#
!
!
!

3 - JSF

Evaluates#to#7#

A#set:#{1,2,3}#
A#list:#[1,2,3]#
A#map:#{"one":1,#"two":2,#"three":3}##

Further Information about the Expression Language

9.7 Examples of EL Expressions

Table 91 contains example EL expressions and the result of evaluating them.
Table 91

27

Example Expressions

EL Expression

Result

${1> (4/2)}

false

${4.0>= 3}

true

${100.0 == 100}

true

${(10*10) ne 100}

false

${'a' > 'b'}

false

${'hip' lt 'hit'}

true

${4> 3}

true

${1.2E4 + 1.4}

12001.4

${3 div 4}

0.75

${10 mod 4}

${((x, y) -> x + y)(3, 5.5)}

8.5

[1,2,3,4].stream().sum()

10

Examples)

[1,3,5,2].stream().sorted().toList()

[1, 2, 3, 5]

${!empty param.Add}

False if the request parameter named Add is null

or an empty string

${pageContext.request.contextPath}

The context path

${sessionScope.cart.numberOfItems}

The value of the numberOfItems property of the

session-scoped attribute named cart

${param['mycom.productId']}

The value of the request parameter named

mycom.productId

${header["host"]}

The host

${departments[deptName]}

The value of the entry named deptName in the

departments map

${requestScope['javax.servlet.forward.servlet_path']} The value of the request-scoped attribute named

javax.servlet.forward.servlet_path
#{customer.lName}

Gets the value of the property lName from the

customer bean during an initial request; sets the
value of lName during a postback

#{customer.calcTotal}

The return value of the method calcTotal of the

customer bean

3 - JSF

9.8 Further Information about the Expression Language

For more information about the EL, see

The Expression Language 3.0 specification:

http://www.jcp.org/en/jsr/detail?id=341

The EL specification website:

https://java.net/projects/el-spec/

28

Writing)a))Managed)Bean))Method)to)
Handle)Navigation)
Expression Language

9-11

Page 1 and 2 are exactly the

same, apart from their number

3 - JSF

29

The)Managed)Bean)

3 - JSF