SEG3202 – Lab 1
Introduction to Servlets and Netbeans IDE
The objective of this lab is to introduce to Servlets programming using Netbeans 5.5 IDE.
SetupFor this lab, you need Netbeans IDE 5.5, Sun Java Application Server as well as J2SE JDK 1.5.0 or higher. Sun Netbeans IDE 5.5 bundle includes both Netbeans IDE 5.5 and Sun Java Application Server.
TaskIn this lab, you will implement a simple servlet based Calculator.
The user enters two numbers using a form and click on a button for an operation (addition, substraction, multiplication, division). The calculator servlet should then perform the requested operation and present a page with the result.
StepsYou will perform the following steps:
1. create a project
2. create the form page
3. create the calculator servlet
4. build and run
Create project
1. Start the IDE
2. Goto File > New Project
Select Web in Categories and Web Application in Projects, and click Next>.
Enter project name: Calculator, browse to a project location, leave everything else as it is and click Finish.
The IDE should show the new project as follow.
Create Form Page1. Rightclick on the project and select New > HTML
Enter index as HTML File Name and click Finish.
2. Add Form element
The IDE includes an editor that can be used to quickly create HTML pages by draging and droping. Click on the Form in the Palette and drag between <body> and </body>.
Set Action as calculate and Name as calculateForm, then click OK.
3. Add <h1>Calculator</h1> after <body>
4. Drag a Table from the Palette just before element </form>. Specify number of rows as 3 and number of column 2.
5. Drag a Text input element from the Palette to between the first <td> and </td> in <tboby>. Specify First as name and 0 as initial value. Write “First Number: ” before element <input>.
6. Drag a Text input element from the Palette to between the second <td> and </td> in <tboby>. Specify Second as name and 0 as initial value. Write “Second Number: ” before element <input>.
7. Drag a Button element from the Palette to between the third <td> and </td> in <tboby>. Specify Add as label and add as name.
8. Drag a Button element from the Palette to between the fourth <td> and </td> in <tboby>. Specify Subtract as label and subtract as name.
9. Drag a Button element from the Palette to between the fifth <td> and </td> in <tboby>. Specify Multiply as label and multiply as name.
10. Drag a Button element from the Palette to between the sixth <td> and </td> in <tboby>.
Specify Divide as label and divide as name.
The end result should be as follow:
<!DOCTYPE HTML PUBLIC "//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title></title> </head> <body> <h1>Calculator</h1> <form action="calculate"> <table border="2" cellspacing="2" cellpadding="2"> <thead> <tr> <th></th> <th></th> </tr> </thead> <tbody> <tr> <td>First Number: <input type="text" name="First" value="0" /></td> <td>Second Number: <input type="text" name="Second" value="0" /></td> </tr> <tr> <td><input type="submit" value="Add" name="add" /></td> <td><input type="submit" value="Subtract" name="subtract" /></td> </tr> <tr> <td><input type="submit" value="Multiply" name="multiply" /></td> <td><input type="submit" value="Divide" name="divide" /></td> </tr> </tbody> </table> </form> </body></html>
11. Set index.html as welcome page
Select file web.xml in subfolder WEBINF of Web Pages. Click on Pages and replace index.jsp with index.html in Welcome Files.
Create Calculator servlet1. Righclick on the project and select New > Servlet
Specify CalculatorServlet as Class Name and calculator as Package, click Next.
Change URL Pattern(s) to /calculate and click Finish.
2. Replace method processRequest with the following
/** Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods. * @param request servlet request * @param response servlet response */ protected void processRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF8"); PrintWriter out = response.getWriter(); out.println("<html>"); out.println("<head>"); out.println("<title>Calculator response</title>"); out.println("</head>"); out.println("<body>"); String sfirst = request.getParameter("First"); String ssecond = request.getParameter("Second"); try { double firstn = Double.parseDouble(sfirst); double secondn = Double.parseDouble(ssecond); double result = 0; if (request.getParameter("add") != null) { result = firstn + secondn; } else if (request.getParameter("subtract") != null) { result = firstn secondn; } else if (request.getParameter("multiply") != null) { result = firstn * secondn; } else if (request.getParameter("divide") != null) { result = firstn / secondn; } out.println("<h1>Result is: " + result + "</h1>"); } catch (Exception e) { out.println("<h1>Wrong parameter types enter numbers</h1>"); } out.println("</body>"); out.println("</html>"); /* */ out.close(); }
Build and Run Project
Select Run > Run Main Project from the IDE tool bar (or Rightclick on the project and select Run Project).
The calculator form should be displayed in a browser if not (and if BUILD IS SUCCESSFUL), go to URL http://localhost:8080/Calculator/.