Lucky Dip Logo
Powered by PlusNet. PlusNet broadband.
Patrick's Lucky Dip
Home > Java > JSP Tutorial > Hello World

Patrick Haston
14 November 2008

JSP Tutorial - Hello World

Oracle has developed a great tool in JDeveloper. It allows you to create all sorts of applications, but all their documentation seems to suppose that you want to use ADF. We found it hard to work out how to do things manually.

To save you the same pain we went through, here's what we learnt.

To create a very simple hello world jsp application.

Start up JDeveloper.

Create a new application workspace (call it LearningJsp if you want).

Create a new project called HelloWorld. Some versions of JDeveloper create a new project called Project automatically. You can ignore or delete this.

You don't need to specify the technology you are using - that's used by JDeveloper to limit your menu choices. Leaving this blank gives you everything.

Click on the new icon (top left on the menu). Expand out the Web Tier branch in the tree control and choose JavaServer Pages (JSP). Choose JSP Page and click Ok. Call it HelloWorld.jsp.

By default it appears in the design layout. I find it much easier to switch to the source layout. You should have something similar to this:

<%@ page contentType="text/html;charset=windows-1252"%>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; 
				charset=windows-1252">
    <title>untitled</title>
  </head>
  <body>
  </body>
</html>

The first line is a jsp tag that is converted by the server into html code. You can probably guess that it is describing the document type. The rest is standard html.

Change the title from untitled to Hello World.

Add this between the <body> </body> tags:

    <h1>Hello</h1>
    <p>This is easy</p>

If you click on the run icon, jsp will fire up a local web server and show you your page in a browser. Very easy so far, but not exactly useful.

The strength of jsp pages is their ability to include java code in them. This code is run by the server (that's why it's called Java Server pages) before the html is sent to the browser. If you want to do more processing on the page when it arrives at the browser you'll have to use a scripting language like JavaScript, but's that's another story.

Let's make our page interactive, so that it does something. That usually means adding an html form to the page. So add this code to your page, anywhere between the body tags.

    <form method="get">
      <label for="name">Name:</label>
      <input type="text" name="name" id="name">
      <input type="submit" name="submit" value="Go">
    </form>

Those of you who know html will notice that I've set the form method to get and that there's no action attribute. Forms usually have one of two types of method, either get or post. Get should only be used to retrieve information from the server, whilst post can be used to send information to the server.

The advantage of get is that it shows on the url of the page. Run the form, enter your name and press Go. You should see your name added onto the url in the browser window as well as the submit button with the value of Go. When I did it I got HelloWorld.jsp?name=Patrick&submit=Go.

The lack of an action attribute means that when the form is submitted then it just calls itself. You can use set the action attribute of a form to cause it to call a different page for processing.

The reason I've surrounded the prompt for the name input field with a label tag is because of accessibility. Screen readers and other devices to support people who need help to use web pages read these tags and make it easier for the user. We all benefit.

Jsp pages allow you to read the values that are sent using either a post or a get. To do this you insert some java code to inspect the html request that the browser sent to the server.

Insert this code above the top html tag:


<%

String name = "";
String submit = "";
String message = "";

try
{
  name = request.getParameter("name");
  if( name == null ) name = "";
  name = name.replaceAll("'", "'");
  
  submit = request.getParameter("submit");
  if( submit == null ) submit = "";
  submit = submit.replaceAll("'", "'");
}
catch (Exception e)
{
  message = "Error: " + e.getMessage();
}

%>

You've declared a couple of variables. Then you try and read these from the http request. It's a good habit to check everything you get from a http request, and because I often end up using these values in sql scripts it's a good idea to check for single apostrophe's. These can not only cause your sql to fail, they are often used in sql injection attacks.

Finally, there's an opportunity to catch any errors that may occur.

Now we can use these values in the page.

We can add a bit of code to the heading to display the name that was entered.

    <h1>Hello <%=name%></h1>

We can also use it to keep the text box updated with the most recently entered value.

      <input type="text" name="name" id="name" value="<%=name%>" >

Now you've built a little interactive web page. It doesn't do much, but it works and hopefully you've learnt something useful.