JavaServer Faces is a new framework for building Web applications using java. JSF provides you with the
following main features:
Basic user interface components like buttons, input fields, links etc. and custom components like tree/table
viewer, query builder etc. JSF was built with a component model in mind to allow tool developers to support
Rapid Application Development (RAD). User interfaces can be created from these reusable server-side
components.
Provides a set of JSP tags to access interface components. Also provides a framework for implementing
custom components.
Supports mark up languages other than HTML like WML (Wireless Markup Language) etc by encapsulating
event handling and component rendering. There is a single controller servlet every request goes through
where the job of the controller servlet is to receive a faces page with components and then fire off events
for each component render the components using a render tool kit.
Uses a declarative navigation model by defining the navigation rules inside the XML configuration file
faces-config.xml. This configuration file also defines bean resources used by JSF.
JSF can hook into your model, which means the model is loosely coupled from JSF.
Let’s look at some code snippets. Texts are stored in a properties file called message.properties so that this
properties file can be quickly modified without having to modify the JSPs and also more maintainable because
multiple JSP pages can use the same property.
account_nuber = Account number
account_button = Get account details
account_message=Processing account number :
input_accountNumber.jsp
<%@ taglib uri="http://java.sun.com.jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com.jsf/core" prefix="f" %>
<f:loadBundle basename="messages" var="msg"/>
<html>
...
<body>
<f:view>
<h:form id="accountForm">
<h:outputText value="#{msg.account_number}" />
<h:inputText value="#{accountBean.accountNumber}" />
<h:commandButton action="getAccount" value="#{msg.account_button}" />
</h:form>
</f:view>
</body>
</html>
AccountBean.Java
public class AccountBean {
String accountNumber;
public String getAccountNumber() {
return accountNumber;
}
public void setAccountNumber(String accountNumber) {
this.accountNumber = accountNumber;
}
}
faces-config.xml
...
<faces-config>
<navigation-rule>
<form-view-id>/jsps/input_accountNumber.jsp</form-view-id>
<navigation-case>
<from-outcome>getAccount</from-outcome>
<to-view-id>/jsps/output_accountNumber.jsp</to-view-id>
</navigation-case>
</navigation-rule>
...
<managed-bean>
<managed-bean-name>accountBean</managed-bean-name>
<managed-bean-class>AccountBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
output_accountNumber.jsp
<html>
...
<body>
<f:view>
<h3>
<h:outputText value="#{msg.account_message}" />
<h:outputText value="#{accountBean.accountNumber}" />
</h3>
</f:view>
</body>
</html>
following main features:
Basic user interface components like buttons, input fields, links etc. and custom components like tree/table
viewer, query builder etc. JSF was built with a component model in mind to allow tool developers to support
Rapid Application Development (RAD). User interfaces can be created from these reusable server-side
components.
Provides a set of JSP tags to access interface components. Also provides a framework for implementing
custom components.
Supports mark up languages other than HTML like WML (Wireless Markup Language) etc by encapsulating
event handling and component rendering. There is a single controller servlet every request goes through
where the job of the controller servlet is to receive a faces page with components and then fire off events
for each component render the components using a render tool kit.
Uses a declarative navigation model by defining the navigation rules inside the XML configuration file
faces-config.xml. This configuration file also defines bean resources used by JSF.
JSF can hook into your model, which means the model is loosely coupled from JSF.
Let’s look at some code snippets. Texts are stored in a properties file called message.properties so that this
properties file can be quickly modified without having to modify the JSPs and also more maintainable because
multiple JSP pages can use the same property.
account_nuber = Account number
account_button = Get account details
account_message=Processing account number :
input_accountNumber.jsp
<%@ taglib uri="http://java.sun.com.jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com.jsf/core" prefix="f" %>
<f:loadBundle basename="messages" var="msg"/>
<html>
...
<body>
<f:view>
<h:form id="accountForm">
<h:outputText value="#{msg.account_number}" />
<h:inputText value="#{accountBean.accountNumber}" />
<h:commandButton action="getAccount" value="#{msg.account_button}" />
</h:form>
</f:view>
</body>
</html>
AccountBean.Java
public class AccountBean {
String accountNumber;
public String getAccountNumber() {
return accountNumber;
}
public void setAccountNumber(String accountNumber) {
this.accountNumber = accountNumber;
}
}
faces-config.xml
...
<faces-config>
<navigation-rule>
<form-view-id>/jsps/input_accountNumber.jsp</form-view-id>
<navigation-case>
<from-outcome>getAccount</from-outcome>
<to-view-id>/jsps/output_accountNumber.jsp</to-view-id>
</navigation-case>
</navigation-rule>
...
<managed-bean>
<managed-bean-name>accountBean</managed-bean-name>
<managed-bean-class>AccountBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
</faces-config>
output_accountNumber.jsp
<html>
...
<body>
<f:view>
<h3>
<h:outputText value="#{msg.account_message}" />
<h:outputText value="#{accountBean.accountNumber}" />
</h3>
</f:view>
</body>
</html>