JSP Page Example

Example JSP Page

A JSP page is a text-based document that contains two types of text: static template data, which can be expressed in any text-based format such as HTML, SVG, WML, and XML, and JSP elements, which construct dynamic content.

The following web page is a form that allows you to select a locale and displays the date in a manner appropriate to the locale.

The source for this example is in examples/src/web/date. The JSP page index.jsp used to create the form appears below; it is a typical mixture of static HTML markup and JSP elements. If you have developed web pages, you are probably familiar with the HTML document structure statements (<head>, <body>, and so on) and the HTML statements that create a form <form> and a menu <select>. The highlighted lines in the example contain the following types of JSP constructs:

Directives (<@page ... %>) import classes in the java.util package and set the content type returned by the page.
The jsp:useBean element creates an object containing a collection of locales and initializes a variable that point to that object.
Scriptlets (<% ... %> ) retrieve the value of the locale request parameter, iterate over a collection of locale names, and conditionally insert HTML text into the output.
Expressions (<%= ... %>) insert the value of the locale name into the response.

The jsp:include element sends a request to another page (date.jsp) and includes the response in the response from the calling page.

<%@ page import="java.util.*" %>
<%@ page contentType="text/html; charset=ISO-8859-5" %>
<html>
<head><title>Localized Dates</title></head>
<body bgcolor="white">
<jsp:useBean id="locales" scope="application" 
	class="MyLocales"/>
<form name="localeForm" action="index.jsp" method="post">
<b>Locale:</b>
<select name=locale>
<% 
	String selectedLocale = request.getParameter("locale");
	Iterator i = locales.getLocaleNames().iterator();
	while (i.hasNext()) {
		String locale = (String)i.next();
		if (selectedLocale != null &&
			selectedLocale.equals(locale)) {
%>
			<option selected><%=locale%></option>
<%	
		} else { 
%>
			<option><%=locale%></option>
<%
		} 
	}
%>
</select>
<input type="submit" name="Submit" value="Get Date">
</form>
<jsp:include page="date.jsp"/>
</body>
</html>

Building this JSP Page

To build, deploy, and execute this JSP page on the J2EE SDK:

Compile the java source files MyLocale.java and MyDate.java
Create a J2EE application called date.
1. Select File->New Application or the New Application button.
2. Enter date.ear in the Application File Name field.
3. Click OK.
Add the date web component to the date application.
1. Select File->New Web Component or the New Web Component button.
2. Select the date application from the Create new WAR File in Application combo box.
3. Enter date in the WAR Display Name field.
4. Click Add.
5. Navigate to examples/build/web/date. Select index.jsp, date.jsp, MyDate.class and MyLocales.class and click Add, then click Finish.
6. Click Next.
7. Click JSP in the Web Component radio box, then click Next.
8. Select index.jsp from the JSP Filename combo box. Type date in the Web Component Display Name text area. Click Next and click Finish.
Deploy the application. Select Tools->Deploy Application or the Deploy Application Button. In the deploy wizard, set the context root to date.
Invoke the URL http://<host>:8000/date in a browser. You will see a combo box whose entries are locales. Select a locale and click Get Date. You will see the date expressed in a manner appropriate for that locale.

From the J2EE Tutorial section on JavaServer Pages Technology by Stephanie Bodoff.

Maintained by John Loomis, last updated 31 March 2001