How to make Spring web Login form?

In the Spring, Hibernate tutorial series we are going to make Spring Web Login form which displays the user name and password to user.

Ads

Tutorials   
Spring 4 Introduction and example Features of Spring Framework 5 How to make Spring web Login form? How to make Simple form in Spring web? Spring, Hibernate login and registration application Spring Framework Tutorial for beginners with examples Spring Framework for Apache Hadoop 2.3.0 GA released Spring Framework 4.1 GA is released with major features Why to use Spring Framework? Spring Framework 4.1 - First Release candidate available Spring IO Platform 1.0.0 Released Spring 4: Login Form using Spring MVC and Hibernate Example Spring 4 MVC Login form Example with source code Spring 4 MVC Hello World Example: Spring 4 MVC Tutorial will full source code Spring Web MVC Application Error:ClassNotFoundException: DispatcherServlet on deploying Features of Spring 4 Spring Framework 4.0 released Spring Framework 4: Spring Framework 4 Tutorials and Example Spring Integration 3.0 Release is released and available for download Spring Tutorial for Beginners Java Springs Framework Tutorial Spring Architecture Spring Framework Tutorials database spring registration form Spring Login Example Roseindia Spring Tutorial Spring Tutorial Spring 3.2 MVC insert and retrieve blob from the database The hidden tag The errors tag net.roseindia.dao net.roseindia.service net.roseindia.model net.roseindia.controller Spring 3.2 MVC Hibernate Example Spring 3.2 MVC, Upload File in a specific folder Spring 3.2 MVC Form Handling The textarea tag The options tag The option tag The select tag The radiobuttons tag The radiobutton tag The checkboxes tag mvc:default-servlet-handler Static Resources Configuration View Controllers Configuration View resolvers Spring 3.2 MVC Hello World Example Content Negotiation Configuration
Ads

Developing Login Form in Spring Web - Create form for user to input login credentials

In our example project login form is an important element of the application which allows the users to enter login credentials during the login process. This pages teaches you to make the login form which is still not connected to the database. In subsequent chapters of this tutorial series we will connect this to the database and validate the user against database.

This example displays the two fields to the user:

  1. Login Name
  2. Password
  3. Button for Login

This example also validates the user input and if validation fails it displays the error to the user. Error is displayed in red color using the css style sheet of HTML. After completing this page you will be able to write form based application in Spring Web  and validate the form using this framework.

Here is the screen shot of the Login Form:

How to make Spring web Login form?

Here is the video instruction of the Tutorial:

When user enters the data and clicks the Submit button, validation is performed and if there is any validation error, error message is displayed on the the form. Here is the screen shot of the error screen:

Spring login form validation error message

How to make Login Form in Spring MVC?

To make the Spring Login form we have to develop the following code in the application:

1. Login From (LoginForm.java)

The Login Form class is used to handle the form data and it contains the variables to handle the login form data. Here is the code of the java code:

package net.roseindia.form;
import javax.validation.constraints.Size;
import org.hibernate.validator.constraints.NotEmpty;
public class LoginForm {
	@NotEmpty
	@Size(min = 1, max = 50)
	private String userName;
	@NotEmpty
	@Size(min = 1, max = 20)
	private String password;

	public void setUserName(String userName) {
		this.userName = userName;
	}
	public String getUserName() {
		return userName;
	}
	public void setPassword(String password) {
		this.password = password;
	}
	public String getPassword() {
		return password;
	}
}

Above class file contains the validation code which validates the user input. The annotations are used for validations:

  • @NotEmpty
  • @Size(min = 1, max = 50)

2. Controller class (LoginController.java)

The Controller class is responsible for handling the request from client and performs the necessary operations. Here is the complete code of LoginController.java file:

package net.roseindia.controllers;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.validation.BindingResult;
import java.util.Map;
import javax.validation.Valid;

import net.roseindia.form.LoginForm;

@Controller
@RequestMapping("loginform.html")
public class LoginController {
	@RequestMapping(method = RequestMethod.GET)
	public String showForm(Map model) {
		LoginForm loginForm = new LoginForm();
		model.put("loginForm", loginForm);
		return "loginform";
	}

	@RequestMapping(method = RequestMethod.POST)
	public String processForm(@Valid LoginForm loginForm, BindingResult result,
			Map model) {
		String userName = "UserName";
		String password = "password";
		if (result.hasErrors()) {
			return "loginform";
		}
		loginForm = (LoginForm) model.get("loginForm");
		if (!loginForm.getUserName().equals(userName)
				|| !loginForm.getPassword().equals(password)) {
			return "loginform";
		}
		model.put("loginForm", loginForm);
		return "loginsuccess";
	}
}

This class is annotated with the @Controller annotations which makes it a conroller class and this class handles the @RequestMapping("loginform.html") request.

3. Form JSP file (loginform.jsp)

This file displays the login form to the user. Here is the full code of the file:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<!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>Spring4Example</title>
</head>
<body>
<h3>Login Form</h3>
<FONT color="blue">
User Name="UserName" and password="password"
</FONT>
<form:form action="loginform.html"  commandName="loginForm">
	<table>
		<tr>
			<td>User Name:<FONT color="red"><form:errors
				path="userName" /></FONT></td>
		</tr>
		<tr>
			<td><form:input path="userName" /></td>
		</tr>
		<tr>
			<td>Password:<FONT color="red"><form:errors
				path="password" /></FONT></td>
		</tr>
		<tr>
			<td><form:password path="password" /></td>
		</tr>
		<tr>
			<td><input type="submit" value="Submit" /></td>
		</tr>
	</table>
</form:form>
</body>
</html>

The form action is <form:form action="loginform.html" which actually submits the data to the controller class using the HTTP POST method. The tag <form:errors path="password" /> is used to display the error message on the form.

4. Login success (loginsuccess.jsp)

This jsp page displays the success message with the user name on the page. Full code of the file:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="core" uri="http://java.sun.com/jsp/jstl/core"%>
<!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>Spring4Example</title>
</head>
<body>
<h3>Welcome <core:out value="${loginForm.userName}" /></h3>
<table>
	<tr>
		<td><a href="loginform.html">Back</a></td>
	</tr>
</table>
</body>
</html>

The tag <core:out value="${loginForm.userName}" /> displays the user name on the form.

5. Mapping all these components in dispatcher-servlet.xml

The code of this file already explained in the previous page.

6. Web application configuration in web.xml file.

The code of this file already explained in the previous page.

You can right click the project and easily run on the Tomcat sever from Eclipse.

Advertisements

Ads
Share on Google+Share on Google+

How to make Spring web Login form?

Posted on: June 30, 2016 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Advertisements

Ads
 

Discuss: How to make Spring web Login form?  

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments:0

Ads

 

Ads