JavaServer Pages (JSP)

The following JSP page (ExampJSP.jsp) is equivalent to ExampServlet in Building Servlets. It starts with the usual HTML, HEAD, TITLE, and BODY tags and concludes with closing the BODY and HTML tags. In between are two types of JSP tags: directives and scriptlets.

JSP directives are instructions that are processed by the JSP engine when the JSP page is translated to a servlet. The directives used in this example tell the JSP engine to include certain packages and classes. Directives are enclosed by the <%@ and %> directive tags.

JSP scriptlets let you embed Java code segments into the JSP page. The embedded code is inserted directly into the servlet that executes when the page is requested. Scriptlets are enclosed in the <% and %> scriptlet tags.
A scriptlet can use the following predefined variables: request, response, out, and in. This means that you can use these variables without declaring them. For example, the PrintWriter out = response.getWriter() line used in the servlet code to create the out object is not needed in a JSP page.

Other JSP tags you can use are comments (<%– comment %>), declarations (<%! String data %>), expressions (<%= request.getParameter %>), and JSP-Specific tags. The following code shows the ExampleJSP.jsp code.


The example was built with the following software configuration:

  • JDK1.8.0_45
  • Apache Tomcat v8.0.36
  • Eclipse Mars.2 Release (4.6.0)

Build the Example in Eclipse

  1. Create JSPProject
  2. Add HTML file to JSPProject
  3. Add the JSP File to JSPProject
  4. Get Rid of Package Errors
  5. Clean, Build, and Run

1. Create JSPProject

  1. In Eclipse, select New > Dyanmic Web Project
  2. Name the project JSPProject and click Finish

2. Add HTML File to JSPProject

  1. Right-click WebContent
  2. Select New > HTML File
  3. Name the HTML file index.html
  4. Copy the following HTML code into indexJSP.html


The following HTML code displays the form shown here. When the user clicks the Click Me button on the form, the JSP gets the text entered and displays the text.



The HTML code has a POST method with an ACTION parameter where you specify the location of the servlet.

<!DOCTYPE html>
<meta charset="ISO-8859-1">
 <h2>I'm a Simple Form</h2>

Enter some text and click the Submit button.

<form method="POST" action="ExampJSP.jsp">
<input type="TEXT" name="data" SIZE=30>
<input type="SUBMIT" value="Click Me">
<input type="RESET">


3. Add JSP File to JSPProject

  1. Right-click WebContent
  2. Select New > JSP File
  3. Name the  JSP file index.jsp and click Finish
  4. Copy the following JSP code into the ExampJSP.jsp file
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">
  <title>Example JSP Page</title>

 <%-- Import Statements --%>
 <%@ page import="*" %>
 <%@ page import="javax.servlet.*" %>
 <%@ page import="javax.servlet.http.*" %>

 <%-- Declaration --%>
 <%! String data; %>

  out.println("<body bgcolor=FFFFFF>");
  out.println("<h2>Button Clicked</h2>");
  data = request.getParameter("data");

  if(data != null && data.length() > 0){
    out.println("Text Entered:");
  } else {
    out.println("No text entered.");
  out.println("<p>Return to <a href=http://localhost:8080/JSPProject/indexJSP.html>Form</a>");

3. Get Rid of Package Errors

If you see a bunch of package errors, it means you need to add the container, as follows:

  1. Right-click JSPProject
  2. Select Properties
  3. Locate Targeted Runtimes in the left column
  4. Select Tomcat v8.0 (or which version you are using)
  5. Click Apply and OK

4. Clean, Build, and Run

  1. Select Project > Clean
  2. Select Project > Build Project
  3. In the servers tab, right-click the server and select Add and Remove . . .
  4. Add JSPProject to the server
  5. Start the server
  6. Either open the Tomcat internal browser or a browser of your choice, and enter the following URL:
JavaServer Pages (JSP)

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s