First Simple Interactive JSP example

Size: px

Start display at page:

Download "First Simple Interactive JSP example"

Emory Dickerson
6 years ago
Views:

1 Let s look at our first simple interactive JSP example named hellojsp.jsp. In his Hello User example, the HTML page takes a user name from a HTML form and sends a request to a JSP page, and JSP page generates a dynamic HTML page based on the data which comes with the request Basically, this JSP page takes a user name input from a Web client and generates a dynamic page to greet the user. The request may come from a Web form page request or from a query string following an URL address of this JSP page. First, examine the Web form HTML file named index.html placed in the JSP directory which is this Web application ROOT directory under webapps.

2 <html> <head> <title>demo1</title> </head> <body> <h3>please enter the user name :</h3><p> <form action="/jsp/hellojsp.jsp"> UserName : <input type="text" name="username"><br><br> <input type="submit" value="submit"> </form> </body> </html> Since index.html is the default html name fortomcat that you even don t need to specify the index.html in the URL address of the browser.

3 This HTML takes a string of a user name from the HTML form and submits a request to hellojsp.jsp as specified in the action attribute of the HTML form. For example, a user types SPSU in the form and pushes the Submit button.

5 The page hellojsp.jsp is placed in the same directory as index.html and WEB-INF. All HTML tags can be used in a JSP page since JSP is an extension of HTML. A JSP file can be placed anywhere an HTML file can be placed. <%@ page import="java.util.*" info = This is a simplest JSP with Java code embedded contenttype= text/html %> <%! Date today; %> <html> <%-- This is a Simplest JSP (comment from JSP tag -- %> <body>  Hello <%= request.getparameter("username") %>! <br> <% today = new Date(); %> <%= today %> </body> </html>

6 The first line is a JSP is a JSP directive element tag (<%@... %>) which directs the JSP engine to set the page structure. It will not result in any Servlet code, just like the import directive in Java or #include directive in C. This directive element tells the JSP engine to import all classes in the java.util package to allow use of the Date class and tells JSP engine that content type of this page is text/html not text/xml or some other Multipurpose Internet Mail Extension(MIME) type.

7 The second line is a JSP declaration element <%!... %> which tells the JSP engine to insert the enclosed java code into the generated Servlet java source code somewhere outside of any method. Variable declarations or method declarations may be placed here. A Date class variable (class reference) is declared here. Of course you can have an in-line variable declaration with its assignment statement instead of the wo separate scripting elements in above JSP example.

8 You see two different comments here. <%--... %> is a JSP comment scripting element which stays on the server while <! > is a regular HTML comment which is sent back to the client. The client can view the HTML comment with the view-source option of Internet browsers. Everything not within JSP element tags will be sent to the client browser as literal data. The word Hello is displayed on the client browser screen followed by the string returned from the next JSP expression scripting element and the!.

9 The expression scripting element <%=... %> will display values of the enclosed expression in string format. In this JSP example, the hellojsp.jsp gets the parameter input string by the getparameter() method of HttpServletRequest object. The input string either comes from the input text field of the request form or the URL query string of this JSP address. The username of the getparameter() method matches the username text input component name in the HTML form.

10 The next JSP scripting element is scriptlet which is simply a Java Servlet code fragment. It is inserted into the service() method of the generated Servlet code. Here, JSP instantiates a new instance of Date class and the current date is displayed in the next expression scripting element.

11 In this JSP you have seen two types of JSP constructs: directive elements and scripting elements (including expression scripting, declaration scripting, scriptlets scripting). We will discuss another type constructor, the action tag element. soon.

12 The following screen shots show the directory structure of this JSP Web application on Tomcat. The index.html and hellojsp.jsp files are placed in the JSP subdirectory of webapps directory.

13 You can use the view option of the browser to view the source HTML code generated by JSP. You can see the HTML comments but you don t see the JSP comments.

14 We can also use JSP expression language of the JS P 2.0 to rewrite the hellojsp.jsp as follows. <%@ page iselignored = "false" %> <html> <body> Hello, ${param['username']}! </body> </html> where username is the parameter name defined in the HTML file.

15 The expression language makes data access much easier. You can use the expression ${param['username']} instead of <%= request.getparameter("username") %> to get the username parameter on the HTML form. From the simple JSP example above you know the JSP works. You can even incorporate the index.html into the hellojsp.jsp so that a single JSP page can display an HTML form for a user to interact with and then respond with the result to clients by itself.

Advantage of JSP over Servlet

Advantage of JSP over Servlet JSP technology is used to create web application just like Servlet technology. It can be thought of as an extension to servlet because it provides more functionality than servlet such as expression language,