JSP-Servlet

Form Handling in JSP-Servlet


Create Maven Project

On the Eclipse, create a Maven project

Click Next button to select Workspace Location for project

Click Next button to select Archetype for project

Click Next button and enter Project Information:

  • Group Id: LearnJSPServletWithRealApps
  • Artifact Id: LearnJSPServletWithRealApps
  • Package: com.demo

Click Finish button to finish create Maven project




Configure pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>LearnJSPServletWithRealApps</groupId>
	<artifactId>LearnJSPServletWithRealApps</artifactId>
	<packaging>war</packaging>
	<version>0.0.1-SNAPSHOT</version>
	<name>Learn JSP-Servlet with Real Apps</name>
	<url>http://maven.apache.org</url>
	<dependencies>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
			<version>3.8.1</version>
			<scope>test</scope>
		</dependency>
		<dependency>
			<groupId>javax.servlet.jsp.jstl</groupId>
			<artifactId>javax.servlet.jsp.jstl-api</artifactId>
			<version>1.2.1</version>
		</dependency>
		<dependency>
			<groupId>taglibs</groupId>
			<artifactId>standard</artifactId>
			<version>1.1.2</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
			<version>3.1.0</version>
			<scope>provided</scope>
		</dependency>
	</dependencies>
	<build>
		<finalName>LearnJSPServletWithRealApps</finalName>
	</build>
</project>

Configure web.xml

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
 	<welcome-file-list>
 		<welcome-file>index.jsp</welcome-file>
 	</welcome-file-list>
</web-app>

Redirect Page

Create new JSP file named index.jsp in src\main\webapp folder. This file will redirect to AccountServlet as below:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<jsp:forward page="account"></jsp:forward>




Create Servlet

Create new package named com.demo.servlets. In this package, create new Servlet named AccountServlet as below:

package com.demo.servlets;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/account")
public class AccountServlet extends HttpServlet {

	private static final long serialVersionUID = 1L;

	public AccountServlet() {
		super();
	}

	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		request.getRequestDispatcher("account/index.jsp").forward(request, response);
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		String description = request.getParameter("description");
		boolean status = request.getParameter("status") == null;
		String gender = request.getParameter("gender");
		String[] languages = request.getParameterValues("languages");
		String role = request.getParameter("role");
		String[] hobbies = request.getParameterValues("hobbies");
		int id = Integer.parseInt(request.getParameter("id"));

		request.setAttribute("username", username);
		request.setAttribute("password", password);
		request.setAttribute("description", description);
		request.setAttribute("status", status);
		request.setAttribute("gender", gender);
		request.setAttribute("languages", languages);
		request.setAttribute("role", role);
		request.setAttribute("hobbies", hobbies);
		request.setAttribute("id", id);

		request.getRequestDispatcher("account/success.jsp").forward(request, response);
	}

}

Create JSP Pages

Create new folder named account in src\main\webapp folder. In this folder, create new JSP files as below:

Index Page

In src\main\webapp\account folder, create new JSP file named index.jsp as below:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1" isELIgnored="false"%>
<html>
<head>
<title>Register</title>
</head>
<body>

	<h3>Register Account</h3>
	<form method="post" action="${pageContext.request.contextPath }/account">
		<table cellpadding="2" cellspacing="2">
			<tr>
				<td>Username</td>
				<td><input type="text" name="username"></td>
			</tr>
			<tr>
				<td>Password</td>
				<td><input type="password" name="password"></td>
			</tr>
			<tr>
				<td valign="top">Description</td>
				<td><textarea name="description" rows="5" cols="20"></textarea>
				</td>
			</tr>
			<tr>
				<td>Status</td>
				<td><input type="checkbox" name="status"></td>
			</tr>
			<tr>
				<td valign="top">Gender</td>
				<td>
					<input type="radio" name="gender" value="male" checked="checked"> Male
					<br>
					<input type="radio" name="gender" value="female"> Female
				</td>
			</tr>
			<tr>
				<td valign="top">Languages</td>
				<td>
					<input type="checkbox" name="languages" value="lang1"> Language 1
					<br>
					<input type="checkbox" name="languages" value="lang2"> Language 2
					<br>
					<input type="checkbox" name="languages" value="lang3"> Language 3
					<br>
					<input type="checkbox" name="languages" value="lang4"> Language 4
				</td>
			</tr>
			<tr>
				<td valign="top">Role</td>
				<td>
					<select name="role">
						<option value="r1">Role 1</option>
						<option value="r2">Role 2</option>
						<option value="r3">Role 3</option>
						<option value="r4">Role 4</option>
					</select>
				</td>
			</tr>
			<tr>
				<td valign="top">Hobbies</td>
				<td>
					<select name="hobbies" multiple="multiple">
						<option value="h1">Hobby 1</option>
						<option value="h2">Hobby 2</option>
						<option value="h3">Hobby 3</option>
						<option value="h4">Hobby 4</option>
					</select>
				</td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<td>
					<input type="submit" value="Save">
					<input type="hidden" name="id" value="123">
				</td>
			</tr>
		</table>
	</form>

</body>
</html>

Success Page

In src\main\webapp\account folder, create new JSP file named success.jsp as below:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<title>Register</title>
</head>
<body>

	<h3>Account Info</h3>
	<table cellpadding="2" cellspacing="2" border="1">
		<tr>
			<td>Username</td>
			<td>${username }</td>
		</tr>
		<tr>
			<td>Password</td>
			<td>${password }</td>
		</tr>
		<tr>
			<td valign="top">Description</td>
			<td>${description }</td>
		</tr>
		<tr>
			<td>Status</td>
			<td>${status }</td>
		</tr>
		<tr>
			<td valign="top">Gender</td>
			<td>${gender }</td>
		</tr>
		<tr>
			<td valign="top">Languages</td>
			<td>
				<c:forEach var="language" items="${languages }">
					${language } <br>
				</c:forEach>
			</td>
		</tr>
		<tr>
			<td valign="top">Role</td>
			<td>${role }</td>
		</tr>
		<tr>
			<td valign="top">Hobbies</td>
			<td>
				<c:forEach var="hobby" items="${hobbies }">
					${hobby } <br>
				</c:forEach>
			</td>
		</tr>
	</table>

</body>
</html>

Structure of Maven Project




Run Application

Select project, right click and select Run As/Run on Server menu

Access DemoServlet with following urls as below:

  • http://localhost:8081/LearnJSPServletWithRealApps
  • http://localhost:8081/LearnJSPServletWithRealApps/account

Output

Click Save button submit form to AccountServlet

Output


Related Posts

Delete Data from Database with Hibernate in JSP-Servlet

Update Data to Database with Hibernate in JSP-Servlet

Create Data to Database with Hibernate in JSP-Servlet