Struts 2 Login Application

Developing Struts 2 Login Application
In this section we are going to develop login application based on Struts 2 Framework. Our current login application does not validate the user against the database. Instead login name and password are validated against the hardcode values (User: Admin and Password: Admin) in the actions class.

Working of the application

Login page is displayed to take the input.
User enters user name and password and then clicks on the "Login" button.
User validation is done in action class and if user enters Admin/Admin in the user name/password fields, then success pages is displayed. Otherwise the error message is displayed on the screen.

Steps to develope the application

Here are simple and easy steps to develop Login page in the using Struts 2 framework.

Develop Login Form
The GUI of the application consists of login form (login.jsp) and success message page (loginsuccess.jsp).
The login.jsp is used to display the login page to the user. In our application it is saved in "webapps\struts2tutorial\pages\" folder. Here is the code of login.jsp file:

<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
<title>Struts 2 Login Application!</title>

<link href="<s:url value="/css/main.css"/>" rel="stylesheet" type="text/css"/>

</head>
<body>
<s:form action="doLogin" method="POST">
<tr>
<td colspan="2">
Login
</td>

</tr>

<tr>
   <td colspan="2">
         <s:actionerror />
         <s:fielderror />
   </td>
</tr>

<s:textfield name="username" label="Login name"/>
<s:password name="password" label="Password"/>
<s:submit value="Login" align="center"/>

</s:form>

</body>

</html>

The code :
<s:actionerror />
<s:fielderror />
displays action errors and field validation errors.

The code <s:form action="doLogin" method="POST"> generates the html form for the application.

The code :
<s:textfield name="username" label="Login name"/>
<s:password name="password" label="Password"/>
generates Login Name and Password fields.

The submit button is generated through <s:submit value="Login" align="center"/> code.

When application is executed it generates the following html code:

<html>
    <head>
        <title>Struts 2 Login Application!</title>

	    <link href="/struts2tutorial/css/main.css" rel="stylesheet"
          type="text/css"/>
		  
	</head>
    <body>

<form id="doLogin" name="doLogin" onsubmit="return true;" 
action="/struts2tutorial/roseindia/doLogin.action" method="POST">
<table class="wwFormTable">
			
 <tr>
       <td colspan="2">
           Login
       </td>

   </tr>

   <tr>
    <td class="tdLabel"><label for="doLogin_username" class="label">
     Login name:</label>
    </td>
    <td><input type="text" name="username" value="" id="doLogin_username"/>
   </td>
  </tr>

 <tr>
    <td class="tdLabel"><label for="doLogin_password" class="label">
    Password:</label></td>
    <td><input type="password" name="password" id="doLogin_password"/>
</td>
</tr>

 <tr>
    <td colspan="2"><div align="center"><input type="submit" 
     id="doLogin_0" value="Login"/>
</div></td>
</tr>
</table></form>
    </body>

</html>

On viewing the above generated html code you will find that Struts 2 automatically generates form, html table, label for the html elements. This is the another great feature of Struts as compared to Struts 1.x.

The loginsuccess.jsp page displays the Login Success message when user is authenticated successfully. Here is the code of loginsuccess.jsp file:

<html>

<head>

<title>Login Success</title>

</head>

<body>

<p align="center"><font color="#000080" size="5">Login Successful</font></p>

</body>

</html>

Developing Action Class
Now let's develop the action class to handle the login request. In Struts 2 it is not necessary to implement the Action interface, any POJO object with execute signature can be used in Struts 2. The Struts 2 framework provides a base ActionSupport class to implement commonly used interfaces. In our action class (Login.java) we have implemented ActionSupport interface. Our "Login.java" is saved in the "webapps\struts2tutorial\WEB-INF\src\java\net\roseindia" directoy. Here is the code of Login.java action class:


package net.roseindia;

import com.opensymphony.xwork2.ActionSupport;

import java.util.Date;





/**

 * <p> Validate a user login. </p>

 */

public  class Login  extends ActionSupport {





    public String execute() throws Exception {

        System.out.println("Validating login");

    if(!getUsername().equals("Admin") || !getPassword().equals("Admin")){

            addActionError("Invalid user name or password! Please try again!");

            return ERROR;

    }else{

      return SUCCESS;

    }

  }





    // ---- Username property ----



    /**

     * <p>Field to store User username.</p>

     * <p/>

     */

    private String username = null;





    /**

     * <p>Provide User username.</p>

     *

     * @return Returns the User username.

     */

    public String getUsername() {

        return username;

    }



    /**

     * <p>Store new User username</p>

     *

     * @param value The username to set.

     */

    public void setUsername(String value) {

        username = value;

    }



    // ---- Username property ----



    /**

     * <p>Field to store User password.</p>

     * <p/>

     */

    private String password = null;





    /**

     * <p>Provide User password.</p>

     *

     * @return Returns the User password.

     */

    public String getPassword() {

        return password;

    }



    /**

     * <p>Store new User password</p>

     *

     * @param value The password to set.

     */

    public void setPassword(String value) {

        password = value;

    }



}

Configuring action mapping (in struts.xml)
Now we will create action mapping in the struts.xml file. Here is the code to be added in the struts.xml:

<action name="showLogin">
<result>/pages/login.jsp</result>
</action>

<action name="doLogin" class="net.roseindia.Login">
<result name="input">/pages/login.jsp</result>
<result name="error">/pages/login.jsp</result>
<result>/pages/loginsuccess.jsp</result>
</action>

In the above mapping the action "showLogin" is used to display the login page and "doLogin" validates the user using action class (Login.java).

CSS file (main.css)
This css file is used to enhance the presentation of the login form. The main.css is saved into "\webapps\struts2tutorial\css" directory.
Here is the code of main.css:

@CHARSET "UTF-8";

body {
font: 12px verdana, arial, helvetica, sans-serif;
background-color:#FFFFFF;
}

table.wwFormTable {
font: 12px verdana, arial, helvetica, sans-serif;
border-width: 1px;
border-color: #030;
border-style: solid;
color: #242;
background-color: #ada;
width: 30%;
margin-left:35%;
margin-right:35%;
margin-top:15%;
}

table.wwFormTable th {
}

table.wwFormTable tr td {
background-color: #dfd;
margin: 5px;
padding: 5px;
}

.tdLabel {
/*
border-width: 1px;
border-color: #afa;
border-style: solid;
*/
font-weight: bold;
align: top;
}

.label {
}

.errorMessage {
color: red;
font-size: 0.8em;
}

#headerDiv {
border-style: solid;
border-width: 1px 1px 0px;
border-color: black;
padding: 5px;
background-color: #7a7;
/* height: 22px; */
height: 1.8em;
/* margin-bottom: 12px; */
}

#buttonBar {
border-width: 0px 1px 1px;
border-style: solid;
border-color: black;
color: white;
margin-bottom: 12px;
background-color: #7a7;
height: 1.6em;
padding: 5px;
}

#appName {
color: white;
font-size: 1.8em;
}

#pageTitle {
font-size: 1.4em;
color: #dfd;
clear: none;
}

#appName, #pageTitle {
float: right;
}

#menuContainer {
float: left;
}

#brandingContainer {
float: right:
text-align: right;
}

In the next section we will learn how to add validation to the login application.

Current Comments

9 comments so far (post your own) View All Comments Latest 10 Comments:

We have form action=doLogin in JSP but in Struts.xml we used actions doLogin and showLogin .
How does showLogin work?

Posted by Boobalan on Thursday, 02.28.08 @ 11:50am | #50384

View This Comment Separately

hi
i want to do database user login validation
meant i want to create database connection object use in session
my query for validation can use session connection object
how can do i
please reply

Posted by hardik shah on Tuesday, 02.5.08 @ 15:51pm | #47293

View This Comment Separately

struts.jar mean struts2tutorial.jar ;)

Posted by Emmilioz on Monday, 08.13.07 @ 00:22am | #23249

View This Comment Separately

now is ok, it's work

error was in two place, structure project (I don't create struts.jar in my project, becouse I don't need this, maybe someday...), and second I try create struts.xml action with class

<action name="showLogin" "here">
<result>/pages/login.jsp</result>
</action>

my bad, but now work :)))

Posted by Emmilioz on Monday, 08.13.07 @ 00:20am | #23248

View This Comment Separately

what is structure project ? please show on the graph all structure with cataloges and files for Eclipse... then maybe I will see what is wrong ...

Posted by Emiliozzz on Thursday, 08.2.07 @ 13:26pm | #22479

View This Comment Separately

why I don't have generates code ??? for example:
"<table class="wwFormTable">" ???

Posted by Emmilioz on Wednesday, 08.1.07 @ 00:35am | #22356

View This Comment Separately

Do you have code which demonstrates how to connect to a database using Struts2 and hibernate?
Or can you suggest a link as I do not want to use Spring(I am relatively new to framework development)

Look forward to a reply.
Anisha

Posted by Anisha on Thursday, 07.12.07 @ 01:00am | #21113

View This Comment Separately

Hello,

the content is no doubt excellent.

but some proof reading has to be done as there are lots of typos and errors while describing how things work.