5.2
Building the Application
We will begin the construction of the demo application by first
focusing on creating the JSP pages. Since our demo application is
going to mimic a login screen on a website, we will only need 2
JSP pages:
userLogin.jsp and
userLoginSuccess.jsp. As with most Struts apps, if
something goes wrong during the login, we will send the user back
to the
userLogin.jsp page and display an error (which is why we
don't need to make a
loginUserFailure.jsp page).
We will start by creating our
userLoginSuccess.jsp page first. This seems backwards by
creating the last page first, but we are doing it this way so we
can use the
New Form, Action and JSP wizard to create the first JSP
page along with the related Action and ActionForm.
Let's create the
userLoginSuccess.jsp JSP page from our designer view by
using the "JSP" palette tool by clicking it first then
clicking our canvas. Follow Figure 12 below for guidance:
Figure 12 - Create a JSP Using
the Designer
After clicking on the canvas, we will be prompted with the
familiar
New JSP dialog as shown in Figure 13.
Note:
Be sure to select the "Standard JSP using Struts
1.1" template
Figure 13 - Configure the JSP
Wizard
After clicking
Finish, the design view, in Figure 14, will show the
newly created page.
Note:
After adding the new JSP page, MyEclipse will open the
new JSP page in the JSP editor, in the screenshot below we have
clicked back to the designer to show you what your application
is starting to look like, don't get confused if this is not the
flow you see when you create the JSP page.
Figure 14 - Struts Designer
showing our JSP page
All that remains to complete the JSP page is to output a message
to tell the user that the login was successful. The
completed source code for the page is shown in Figure 14a, below.
Note:
For the purposes of making this guide easier to follow
(and the code snippets shorter) the JSP page below does not
resemble the default JSP template you will have once you open
the file for the first time, you are free to exactly copy the
code we have here or adopt it to the default JSP template code
that you have after creating the new JSP file.
|
<%@ page language= "java"%>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-bean"
prefix="bean" %>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-html"
prefix="html" %>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-logic"
prefix="logic" %>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-tiles"
prefix="tiles" %>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-template"
prefix="template" %>
<%@ taglib
uri="http://jakarta.apache.org/struts/tags-nested"
prefix="nested" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN">
<html:html locale="true">
<head>
<title>My Struts
'userLoginSuccess.jsp' ending page</title>
</head>
<body>
Hello <bean:write
name="userName" scope="request" />,
you successfully logged in!
</body>
</html:html>
|
Figure 14a - Code for
userLoginSuccess.jsp
Notice that this page is very simple. The only
thing important that we are doing here is the contents of the
<body> tag, printing out the value of the variable
userName that is stored in the request scope of our
application. So, in our action that we will create later, we
need to place an attribute by the name of
userName in the request scope.
Now we still need to create the
userLogin.jsp page, the ActionForm and the Action.
This may sound like a lot of work, but MyEclipse can streamline
this considerably by way of the
New Form and
New Form, Action and JSP wizards.
When creating the
userLogin.jsp page we need to consider the fields we
want to display in this page and map those fields to the
respective ActionForm. The form will store the values and
ensure they get passed to the proper Action. Both of the
MyEclipse wizards mentioned above, when generating the Form,
offer the ability to create a JSP page along with the
form. This will take all the properties of the
Form and generate a JSP page with all those form fields already
in it and ready to use. In this situation since we also want to
create an Action to process the login, we will use the
New Form, Action and JSP wizard instead of just the
New Form wizard.
To continue building the application, right click on the white
canvas area of the Struts designer, select new and then the
New Form, Action and JSP wizard as in Figure 15:
Figure 15 - Launch New Form,
Action, JSP Wizard from Designer
You will first be presented with the
New Form wizard, since it is the first of a three
step wizard. Be sure to enter a use case name so the wizard
can fill in good default values for you. Figure 16 shows how
values will be filled in for you as you enter a
use case :
Figure 16 - New Form Wizard
Now we need to add two form properties:
userName and
password. When adding the password field,
choose password for the
JSP input type field as shown in Figure 17.
Figure 17 - Add Properties to
the Form
Figure 18 - Form Properties
Before selecting Next, be sure to click the
JSP tab to tell the wizard that you wish MyEclipse to
generate a skeleton JSP page having a form with these values in
it. Figure 19 shows this below:
Note:
The default behavior of the wizard is to place generated
JSPs into a "/form" subdirectory, for the purpose of
this demo application we are going to place all the JSPs in the
webroot.
Figure 19 - Enable JSP Page
Generation for Form
Lastly we need to click on the
Methods tab to be sure to uncheck all the methods that
the wizard can auto-generate for you in the new Form. Figure 20
shows this configuration.
Note:
For the purposes of keeping this demo simple we won't
generate custom reset or validate methods, but it is generally a
good idea to make use of these methods when coding your own
application.
Figure 20 - Disable Method
Generation
After you click
Next, you will be directed to the
New Action wizard where you will notice that most all of
the values are already filled in for you. Here is another
place that MyEclipse saves you time, by tying together
the Form you just created with the new Action. You are
free to make any changes you want, but most likely the only thing
you need to worry about now (certainly in this demo application)
is to fill out the
Forwards that this Action has available to it. Figure 21
gives you a screenshot of the wizard.
Figure 21 - Struts Action
Wizard
You can specify the ActionForwards by clicking the
Forwards tab as shown in Figure 22.
Figure 22 - Setting up the
Action Forwards
After you are done adding the
Forwards for this action, clicking finish will allow
MyEclipse to create all the resources and update the
struts-config.xml file (and Designer) with all the new
information. Figure 23 displays the updated layout and structure
of the application.
Note:
Some manual layout was done to be able to show all the
elements of the diagram clearly in a small screenshot.
When you manually layout a diagram, your changes will be
preserved for future edits.
Figure 23 - Overview of Struts
Designer and our Application
Now that the application flow has been defined, we need to add
logic to the Action to handle the "login" procedure for
this demo application. We can quickly jump to any resource from
the design by double clicking on it, as shown in Figure 24:
Figure 24 - Double-click on a
Designer Resource to Open an Editor
When you open the
UserLoginAction.java file for the first time, the
generated code for our
execute method will look like Figure 24a.
|
public ActionForward execute(
ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response) {
UserLoginForm userLoginForm = (UserLoginForm)
form;
throw new UnsupportedOperationException(
"Generated method 'execute(...)' not
implemented.");
}
|
Figure 24a - Generated execute
Method
We want to remove the default implementation, which simply throws
an exception, and replace it with some simple login logic like
that shown in Figure 24b.
public ActionForward execute(
ActionMapping mapping,
ActionForm form,
HttpServletRequest request,
HttpServletResponse response) {
UserLoginForm userLoginForm = (UserLoginForm)
form;
if(userLoginForm.getUserName().equals("myeclipse")
&&
userLoginForm.getPassword().equals("myeclipse"))
{
request.setAttribute("userName",
userLoginForm.getUserName());
return
mapping.findForward("success");
}
return mapping.findForward("failure");
}
|
Figure 24a - Corrected execute
Method
Here we are doing something very simple, just checking if the
userName and
password values are both "myeclipse". If they
are, we store the
userName in the request scope and return the
success forward, so our
userLoginSuccess.jsp page can display a personalized
message. Otherwise, something went wrong and we return the
failure forward. In a real application, you would
typically add an ActionMessages or ActionErrors collection back
to the request scope before returning a
failure forward, in order to explain what happened.
|