JAVA SERVER FACES - Columbia University

Transcript JAVA SERVER FACES - Columbia University

JAVA SERVER FACES
ADITI RAJORIYA
UNI – ar2630
POINTS TO BE DISSCUSED







WHAT IS JSF?
WHY JSF?
ARCHITECTURE
JSF VERSIONS
UI COMPONENTS
JSF STRUCTURE AND CODE
AJAX FUNCTIONALITY
JAVA SERVER FACES






A Java Web Application Framework
It is a set of UI Components
It consists of API’s to represent components,
manage states, validate inputs
It uses custom tag libraries to use JSF in JSP
Navigations
Back End Data Integration
Why JSF?
JSP and Servlet
– No built-in UI component model
 Struts
– No built-in UI component model
– No built-in event model for UI components
– No built-in state management for UI components
– No built-in support of multiple renderers
– Not a standard
 Struts and JSF can be used together

Architecture




Model View Controller
Model : Managed Beans
View : JSP Pages
Controller : Components, Listeners
JSF VERSIONS
JSF 1.0
 JSF 1.1
 JSF 1.2
Part of J2EE 5.0
Dependant on: JDK 1.4, Servlet 2.5

USER INTERFACE COMPONENT
MODEL





UI components
Event handling model
Conversion and Validation model
Rendering model
Page navigation support
UI COMPONENTS

UICOMPONENT / UICOMPONENTBASE
It is a base class for all UI Components.

Standard UIComponent Subclasses
UICommand
UIForm UIOutput UIInput
UIGraphic UIPanel
UIParameter, UISelectBoolean
VALIDATORS AND CONVERTORS

VALIDATORS
Perform correctness checks on UIInput values
VALIDATORS AND CONVERTORS

CONVERTORS
They are plugin for conversions.
VALIDATORS AND CONVERTERS
EXAMPLE
 Converter
<h:input_textvalueRef=”testingBean.todaydate”
convertor=”DateTime”/>

Validators
<h:input_text valueRef=”testingBean.today”
<f:validator_length minimum=”6” maximum='10” />
RENDERING MODEL

RENDERERS – Adapt components to certain mark
up languages

RENDER KITS – Libraries for Rendering
Map component classes to component tags
Is a custom tag library
Basic HTML Render Kit
EVENTS AND LISTENERS
Follows java beans design and patterns
 Standard Events and Listeners
Action Event – UICommnad component
activated by the user.
Value Changed Event – UIInput component
whose value has changed just now

NAVIGATION MODEL
Defined in Application Configuration file
Facesconfig.xml
 Navigation Rules determine
Pages to go next and Navigation case

NAVIGATION MODEL
<navigation-rule>
<from-tree-id>/login.jsp</from-tree-id>
<navigation-case>
<from-outcome>success</from-outcome>
<to-tree-id>/welcome.jsp</to-tree-id>
</navigation-case>
<navigation-case>
<from-outcome>failed</from-outcome>
<to-tree-id>/error.jsp</to-tree-id>
</navigation-case>
</navigation-rule>
JSF STRUCTURE





It comprises of model objects such as
managed beans that hold the data.
These managed beans are added to Facesconfig.xml
Create pages using UI component and Tags
Define page navigation in faces-config.xml
Configure web.xml
Managing Beans





The model (M) in MVC
A regular JavaBeans with read/write
properties and get/set methods.
May contain application methods and event
handlers
Use to hold data from a UI (page)
JSF keeps the bean's data in sync with the UI
Example : PersonBean
public class PersonBean {
String personName;
/**
* return Person Name
*/
public String getPersonName() {
return personName;
}
/**
* param Person Name
*/
public void setPersonName(String name) {
personName = name;
}
}
Managed Bean Declaration
<managed-bean>
<managed-bean-name>
PersonBean
</managed-bean-name>
<managed-bean-class>
myapp.PersonBean
</managed-bean-class>
<managed-bean-scope>
request
</managed-bean-scope>
</managed-bean>
CREATING JSF PAGES
Must include JSF tag library
HTML and core tags
 All JSF tags must enclosed between a set of view tag
 Use JSF form and form component tags
<h:input_text><input type=”text”>
<h:command_button><input type=”submit”>
 May include validators and event listeners on any form
components

SAMPLE JSP PAGE(greeting.jsp)
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<html>
<head>
<title>greeting page</title>
</head>
<body>
<f:view>
<h3>
<h:outputText value="#{msg.greeting_text}" />
<h:outputText value="#{personBean.personName}" />
<h:outputText value="#{msg.sign}" />
</h3>
</f:view>
</body>
</html>
PAGE NAVIGATION RULES
<faces-config>
<navigation-rule>
<from-view-id>/pages/inputname.jsp</from-view-id>
<navigation-case>
<from-outcome>greeting</from-outcome>
<to-view-id>/pages/greeting.jsp</to-view-id>
</navigation-case>
</navigation-rule>
<managed-bean>
<managed-bean-name>personBean</managed-bean-name>
<managed-bean-class>jsfks.PersonBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
CONFIGURE web.xml
<context-param>
<param-name>
javax.faces.application.CONFIG_FILES
</param-name>
<param-value>/WEB-INF/faces-config.xml
</param-value>
</context-param>
<servlet>
<servlet-name>Faces Servlet</servlet-name>
<servlet-class>
javax.faces.webapp.FacesServlet</servlet-class>
<load-on-startup> 1 </load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>Faces Servlet</servlet-name>
<url-pattern>/faces/*</url-pattern></servlet-mapping>
JSF DIRECTORY STRUCTURE






WEB-INF/web.xml
WEB-INF/faces-config.xml
WEB-INF/classes/PersonBean.class
Greeting.jsp
Inputname.jsp
Index.jsp
JSF AND AJAX




JSF allows to create its own portable
components.
This characterstic makes JSF perfect
companion to AJAX.
No Need to write Javascript code.
Component Developers can directly
encapsulate the components
THANK YOU

JAVA SERVER FACES - Columbia University

Transcript JAVA SERVER FACES - Columbia University

Directory