Scribd
Upload
46 views27 pages

Introduction To Java Server Faces: Aaron Zeckoski

- Java Server Faces is a Java web application framework that includes UI components, APIs to manage components and handle events, custom tag libraries, and managed beans. - It uses a component-based model and is servlet-based, normally using JSPs for views. The framework includes templates defined in JSPs, backing beans to handle logic, and a faces-config file defining managed beans and navigation rules. - Templates define the interface using custom tag libraries and expression language. Backing beans connect components to the business logic layer and handle user actions and navigation. The faces-config defines beans and navigation between views.

Uploaded by

Jayna Shah
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
46 views27 pages

Introduction To Java Server Faces: Aaron Zeckoski

- Java Server Faces is a Java web application framework that includes UI components, APIs to manage components and handle events, custom tag libraries, and managed beans. - It uses a component-based model and is servlet-based, normally using JSPs for views. The framework includes templates defined in JSPs, backing beans to handle logic, and a faces-config file defining managed beans and navigation rules. - Templates define the interface using custom tag libraries and expression language. Backing beans connect components to the business logic layer and handle user actions and navigation. The faces-config defines beans and navigation between views.

Uploaded by

Jayna Shah
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 27

Introduction to

Java Server Faces

Aaron Zeckoski
[email protected]

Creative Commons
Attribution-NonCommercial-ShareAlike Sakai Programmer's Café
2.5 License
Java Server Faces
• A Java web application framework
– Includes the following
• A set of UI components (represent html entities)
• APIs to represent components, manage state,
handle events, validate input, etc.
• Custom tag libraries to put JSF in a JSP
• State management and even model
• IoC Backing Beans (managed beans)
• Expression Language (EL)
• Servlet based, normally uses JSPs

URL: http://en.wikipedia.org/wiki/JavaServer_Faces 2
Theory vs. Practice

3
In theory
• Web applications that work more like desktop
apps
– Easier to program
– Less concern about request cycle
• Better scoping and separation
– Application/Session/Request
• Component bindings from UI to model
• Abstract component tree that is independent
of the target (HTML, etc.)
• Good separation of the logic and presentation

4
In practice
• Harder to work with than the average web application
framework
– Big learning curve
– Have to understand the request cycle well
• Especially the ways JSF may short circuit it
• Prevents you from accessing half the capability of HTML
– Abstraction done via custom taglibs which make the templates
into “JSF XML”
– Logic in template and custom tags defeat the goal of separation
of UI and logic
• JSF event-model introduces the need for wrappers to
actually deal with model
– Must keep the component tree and event-model in session

5
JSF structure and code

6
JSF structure
• The template (most
commonly jsp) defines the Template
interface (jsp)

• The faces-config defines the


faces-config
navigation and the backing (xml)
beans
• Backing beans handle action Backing Bean
processing, navigation (java)
processing, and connections
to the logic (business) layer Wrapper
(java)
• Wrapper bean wraps the data
POJOs for JSF handling
Logic Layer
• Logic layer beans can be (rest of app)
injected as defined in the
faces-config model
• Model is basic data POJO (java)

7
JSF templates
• JSP files most of the time
• Heavily reliant on tag libraries (taglibs)
– Core (f) - basic page definition tags
– Html (h) - defines standard html tags
• Must learn a large set of restrictive taglibs
– Difficult to work with since it does not look like
normal html
– Even more difficult to write new ones
• Large use of EL (expression language)
• Can encourage mixing code with html
8
Sample template
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<f:view>
<html><head><title>Items</title></head><body>
<h:form id="items">
<h:dataTable id="itemlist” value="#{JsfBean.allItems}” var="entry">
<h:column>
<f:facet name="header">
<h:outputText value=""/>
</f:facet>
<h:selectBooleanCheckbox id="itemSelect" value="#{entry.selected}"
rendered="#{entry.canDelete}"/>
<h:outputText value="" rendered="#{not entry.canDelete}"/>
</h:column>
</h:form>
</body></html>
</f:view>

9
faces-config.xml
• Defines the backing beans
– Syntax not like Spring (unfortunately)
– Name used in EL in template
– Scope controlled (request, session, etc.)
• Defines navigation rules
– Based on views
• Where from (view)
• Which outcome (id)
• Where to go (view)
– Can match outcomes using wildcards

10
Sample faces-config
<faces-config>
<navigation-rule>
<from-view-id>/jsf/JsfItems.jsp</from-view-id>
<navigation-case>
<from-outcome>newItem</from-outcome>
<to-view-id>/jsf/JsfAddItem.jsp</to-view-id>
</navigation-case>
<navigation-case>
<from-outcome>*</from-outcome>
<to-view-id>/jsf/JsfItems.jsp</to-view-id>
</navigation-case>
</navigation-rule>

<managed-bean>
<managed-bean-name>JsfBean</managed-bean-name>
<managed-bean-class>org.example.jsf.JsfBean</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
<managed-property>
<property-name>logic</property-name>
<value>#{someLogicBean}</value>
</managed-property>
</managed-bean>
</faces-config>

11
JSF backing beans
• Typical bean with getters and setters and
additional methods to handle actions
– Store data needed for processing the user
actions using setters
– Retrieve data using getters and methods
– Process actions using methods
• Often includes code to wrap data objects
• Connects to the rest of the application
– Typically via injection
• Non-recursive (i.e. not like Spring), will not
instantiate dependencies of dependencies
12
Sample backing bean
public class JsfBean {
private DataModel itemsModel;
private JsfItemWrapper currentItem = null;
...
private JsfLogic logic;
public void setLogic(JsfLogic logic) {
this.logic = logic;
}
...
public DataModel getAllItems() {
List wrappedItems = new ArrayList();
List items = logic.getAllVisibleItems(logic.getCurrentSiteId());
for (Iterator iter = items.iterator(); iter.hasNext(); ) {
JsfItemWrapper wrapper =
new JsfItemWrapper((Item) iter.next());
wrappedItems.add(wrapper);
}
itemsModel = new ListDataModel(wrappedItems);
return itemsModel;
}
...
public String processActionList() {
return "listItems";
}
}
13
JSF wrapper bean
• Wraps basic data POJO
• Required to avoid putting UI information in
the data POJO
• Often includes basic setters and getters
for the UI related properties
– Can be methods as well
• Also includes a setter and getter for the
data POJO

14
Sample wrapper bean
public class JsfItemWrapper {
private Item item;
private boolean isSelected; // is this item selected by the user

public JsfItemWrapper(Item item) {


this.item = item;
}
public Item getItem() {
return item;
}
public void setItem(Item item) {
this.item = item;
}
public boolean isSelected() {
return isSelected;
}
public void setSelected(boolean isSelected) {
this.isSelected = isSelected;
}
}

15
Web app basics
• 4 key things you need to do in a webapp
1. Output dynamic text
• Render data to the screen
2. Loop structures
• Output collection or render tables
3. Optional rendering of components
• Render some components based on state
4. Trigger Actions
• User actions or data transmission

16
Output dynamic text
<h:outputText value="#{JsfAppBean.currentItem.title}"/>

<h:outputText value="#{msgs.jsfapp_text}"/>

• Uses the h:outputText tag


– Also h:outputLabel and h:outputFormat
• Uses Expression Language
– Requires a bean
• Defined in the faces-config or the template
• Can set style and turn on/off escaping

17
Loop structure
<h:dataTable id="itemlist” value="#{JsfAppBean.allItems}” var="entry">
<h:column>
<f:facet name="header">
<h:outputText value="#{msgs.jsfapp_text}"/>
</f:facet>
<h:outputText value="#{entry.item.title}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="#{msgs.jsfapp_hidden}"/>
</f:facet>
<h:selectBooleanCheckbox id="itemHidden" value="#{entry.item.hidden}"
disabled="true" />
</h:column>
</h:dataTable>

• h:dataTable is the main loop structure


– Also h:panelGrid to a degree
• Takes a collection as value
– Uses a variable (entry) to interact with collection
• Uses h:column to define each column

18
Optional rendering
<h:outputText value="#{entry.item.title}"
rendered="#{not entry.canDelete}"/>

<h:commandLink id="updatelink"
action="#{JsfAppBean.processActionUpdate}"
rendered="#{entry.canDelete}">
<h:outputText value="#{entry.item.title}"/>
</h:commandLink>

• Handled per h: tag with the rendered


attribute (which takes EL)
– Can prefix with not to invert
• Brings render logic into the template

19
Trigger actions
<h:commandButton value="#{msgs.jsfapp_new}"
action="#{JsfAppBean.processActionNew}" />

public String processActionNew() {


currentItem = null;
itemText = TEXT_DEFAULT;
itemHidden = HIDDEN_DEFAULT;
return "newItem";
}

• Effectively binds a bean action to a submit


button (h:commandButton)
– Also h:commandLink
• Triggers an action in the bean which returns a
string to indicates the view to navigate to

20
JSF in practice

21
JSF experience
• JSF has a steep learning curve
– Tends to do things in a non-intuitive way
• UI components are restrictive
– Not enough of them, not flexible enough
• Very hard to make AJAX work
– This may be changing
• Uses Javascript too heavily
– URL location is wrong, no back button
• Very hard for UI designers to work with

22
JSF structure revisit
• The template mixes html and
presentation logic Template
(jsp)
– Bad for UI designers
• The faces-config is difficult to faces-config
maintain (navigation also in (xml)
the backing bean)
– Easy to get out of sync Backing Bean
– Syntax not like Spring (java)
• Backing beans actually work
fairly well Wrapper
(java)
– One of the saving graces
• Wrapper bean is extra work Logic Layer
to have to deal with (rest of app)
– Sometimes have to wrap
multiple objects model
(java)
– Requires extra code in the
backing bean

23
Apache MyFaces
• Apache implementation of JSF
– http://myfaces.apache.org/
– Open source
– Better than Sun reference implementation
• Extra features
– Additional and more flexible taglibs
• Tomahawk (h) - new and updated components
– http://myfaces.apache.org/tomahawk/

• Recommended over the Sun RI

URL: http://myfaces.apache.org/tomahawk/ 24
Oracle ADF faces
• A robust and rich set of UI components
that work with JSF
– Advanced tables
– Date and color pickers
– File upload
– Client side validators
• Designed to work with Oracle Jdeveloper
• Decent AJAX support

URL: http://www.oracle.com/technology/products/jdev/htdocs/partners/addins/exchange/jsf/ 25
Other faces
• Facelets
– https://facelets.dev.java.net/
– JSF without JSP (similar to tapestry)
• Struts Shale
– http://shale.apache.org/
– Framework based on JSF, similar to struts

26
Questions?

• Java Server Faces Home


– http://java.sun.com/javaee/javaserverfaces/
• MyFaces
– http://myfaces.apache.org/

27

You might also like