Page History

...

Right-click on WebContent and create a new Folder with the name pages
Right-click on pages folder and create a JSP called login.jsp. Select Finish.
Similarly create another JSP page called welcome.jsp.

Now we have to include the Tag Library Descriptors (TLD) in our application. Geronimo comes packaged with the required TLD's, which can be found in:

No Format

borderStyle	solid
title	Location of TLD

<GERONIMO_HOME>\repository\org\apache\myfaces\core\myfaces-impl\1.2.3\myfaces-impl-1.2.3.jar\META-INF\myfaces-html.tld
and
<GERONIMO_HOME>\repository\org\apache\myfaces\core\myfaces-impl\1.2.3\myfaces-impl-1.2.3.jar\META-INF\myfaces_core.tld

To add these two TLD's in the application, in Eclipse under the Project Explorer right-click on WEB-INF. Create a folder called tld. Copy myfaces-html.tld and myfaces_core.tld to this folder.

The next step is to populate login.jsp and welcome.jsp with data

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	login.jsp

<%@ taglib uri="/WEB-INF/tld/myfaces-html.tld" prefix="h" %>
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld" prefix="f" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Welcome to Apache Geronimo</title>
</head>
<body>
<f:view>
    <h1><h:outputText value="Welcome to Apache Geronimo" /></h1>
    <h:form>
        <h:message for="firstName" style="color: red;" />
        <h:message for="lastName" style="color: red;" />
        <br>
        <h:outputText value="Enter your first name" />
        <br>
        <h:inputText id="firstName" value="#{firstName.name}" required="true">
            <f:validateLength minimum="4" maximum="10" />
        </h:inputText>
        <br>
        <h:outputText value="Enter your last name" />
        <br>
        <h:inputText id="lastName" value="#{lastName.LName}" required="true">
            <f:validateLength minimum="3" maximum="10" />
        </h:inputText>
        <br>
        <h:commandButton id="submit" action="validated" value="Enter" />
    </h:form>
</f:view>
</body>
</html>

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	welcome.jsp

<%@ taglib uri="/WEB-INF/tld/myfaces-html.tld" prefix="h"%>
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld" prefix="f"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Welcome</title>
</head>
<body>
<f:view>
<h3><h:outputText value="You have successfully Loggedlogged in:, " /> <h:outputText value="#{firstName.name} " /> <h:outputText value="#{lastName.LName}" />
<h:outputText value="!" /></h3>
</f:view>
</body>
</html>

Lets now try to understand what each line of code represents.

The first two lines in login.jsp defines two tag libraries

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	Code Snippet from login.jsp

<%@ taglib uri="/WEB-INF/tld/myfaces-html.tld" prefix="h" %>
and
<%@ taglib uri="/WEB-INF/tld/myfaces_core.tld" prefix="f" %>

These two sets of tags are defined by JSF. First one with the namespace "h" is used to generate html views. Second one with the namespace "f" handles the core functionalities of JSF like type conversions, validations and listeners for input from user.

The next few lines contains the usual html tags

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	Code Snippet from login.jsp

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Welcome to Apache Geronimo</title>
</head>
<body>

<f:view> -- This tag represents the start of JSF code.
Code Block
ActionScript
ActionScript
borderStyle solid
title Code Snippet from login.jsp
<h:inputText id="firstName" value="#{firstName.name}" required="true">
Represents the input tag. id="firstName" and value="firstName.name" comes from the Managed Bean.
Using the Faces Configuration Editor, select firstName bean under Managed Bean tab. The Managed Bean Name is firstName. See the figure below.

This completes the implementation of View (V) in the application. The other tags <f:validateLength> and <h:commandButton> will be explained in the next section.

...

Launch the Faces Configuration Editor by double-clicking on faces-config.xml
Select the Navigation Rule tab in the Configuration Editor. Under the Palette window select Page. This will select a PageFlow Page GUI object.
Drag the mouse over the Navigation Rule Window and click on the window. This will give a Select JSP File window. Select the login.jsp as shown in the figure and select OK.
Similarly add the welcome.jsp page on the Navigation Rule window. See the figure below:
Select Link from the Palette window and join the two pages as shown in the figure:
Select the link between the two pages and go to properties view and set the value for From Outcome field as validated. This is because of the tag <h:commandButton id="submit" action="validated" value="Enter" />. Once all the inputs are valid the action taken is validated. See the figure
Once done have a look the Source tab in the Faces Navigation Editor. A <navigation-rule> tag has been introduced into the faces-config.xml. This rule instructs the Controller that if all the inputs are valid from a form in the /pages/login.jsp, and the action is validated, then go to page /pages/welcome.jsp.

Now lets add a index.jsp under WEB-INF WEBCONTENT as follows:

Code Block

	ActionScript
	ActionScript
borderStyle	solid
title	index.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"pageEncoding="ISO-8859-1"%>
<\!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>
<jsp:forward page="/pages/login.jsf" />
</body>
</html>

What is the login.jsf in the forward path tag ?? If you look at the web.xml *.jsf is used as the URL pattern to suggest that forwarded page be taken care by Java Server Faces Servlet.
This completes the Application Development process. The next step is to deploy and test the application.

...

Right-click on the project SimpleJSF and select Run As --> Run On Server. This will deploy the sample on the Apache Geronimo Server and a Login page will be launched.

Lets give some sample inputs:

Sample Input1Input #1:

First Name: Mickey
Last Name: Mouse

Both the First Name as well as Last Name fulfills the validation rules, so this form will be submitted to controller and according to the navigation rule controller will launch a welcome.jsp page.

Sample Input2Input #2:

First Name: Mic
Last Name: Mouse

First Name should be minimum of length=4 but in this case First Name is of length=3. In this case validation will fail and an error message will be generated by controller for First Name field.

Sample Input3Input #3:

First Name: Mickey
Last Name: Mo

Last Name should be minimum of length=3 but in this case Last Name is of length=2. In this case validation will fail and an error message will be generated by controller for Last Name field.

Child pages

Versions Compared

Old Version 103

New Version 104

Key