Unformatted text preview:

Computer Science 396SExample using html forms, JavaScript, and cascading style sheetsFor the next assignment, enhance your project by adding at least one of the following:- A form with radio buttons, a check box, or a list box.- A cascading style sheet.- Javascript.An example that uses a form with radio buttons, a style sheet, and Javascript follows. The choices for the radio buttons include all the servlets that we have been writing. However, only two of them are included here, a DisplayServlet and an InsertServlet. Forms display.html and insert.html are also shown.choices.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><link rel="stylesheet" type="text/css" href="choices-styles.css" /><head><title>Grocery Store</title><script language = "Javascript" src = "choice-script.js"> </script></head><body><h2>Grocery Store</h2><h3>Make a Choice</h3><table><form name="ChoiceForm" > <tr><td><input type="radio" name = "choices" value = "display" onClick="MakeChoice (this.value)" /> Display All</td></tr> <tr><td><input type = "radio" name = "choices" value = "find" onClick="MakeChoice (this.value)" /> Find a Name</td></tr> <tr><td><input type = "radio" name = "choices" value = "insert" onClick="MakeChoice (this.value)" /> Insert an Item</td></tr> <tr><td><input type = "radio" name= "choices" value = "delete" onClick="MakeChoice (this.value)" /> Delete an Item</td></tr> <tr><td><input type = "radio" name= "choices" value = "change" onClick="MakeChoice (this.value)" /> Change a Price</td></tr></form></table> </body></html>choice-styles.css/* Style sheet for deli application. */body {background-image: url("white.gif");text-align: center;color: blue;}h1,h2,h3,h3,h4,h5,h6{color: blue}form{color: seagreen}table{border-color: blue;border-style: solid;border-width: 2px;padding-left: 2cm;padding-right: 2cm; }choice-script.js<!--function MakeChoice (value){if (value == "display") choiceWindow = window.open ("display.html", "Window", "width=400, height=400");if (value == "find") choiceWindow = window.open ("find.html", "Window", "width=400, height=400")if (value == "insert") choiceWindow = window.open ("insert.html", "Window", "width=400, height=400")if (value == "delete") choiceWindow = window.open ("delete.html", "Window", "width=400, height=400")if (value == "change") choiceWindow = window.open ("change.html", "Window", "width=400, height=400")}//-->display.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head> <title>Display Items</title><link rel="stylesheet" type="text/css" href="choices-styles.css" /></head><body><h3>Display Products</h3><form method = "get" action="http://localhost/servlet/produce.DisplayServlet"><p><input type="submit" value="Display Product" /></p></form></body></html>DisplayServlet.javapackage produce;import java.sql.*;import java.io.*;import javax.servlet.*;import javax.servlet.http.*;/* DisplayServlet displays all the data in the database. */public class DisplayServlet extends HttpServlet{public void doGet (HttpServletRequest request, HttpServletResponse response) {try{PrintWriter out = response.getWriter ();Page.createHeader (out, "Display Products");// Get a jdbc-odbc bridge and connect to produce.mdb.Class.forName ("sun.jdbc.odbc.JdbcOdbcDriver");Connection con = DriverManager.getConnection ("jdbc:odbc:produce");String keyName = request.getParameter ("keyName");Statement stmt = con.createStatement ();String query = "Select * From ProduceTable";ResultSet rs = stmt.executeQuery (query);// Set up the heading for the table.out.println ("<table border='1' bordercolor='#000000' cellspacing='5'>");out.println ("<caption>Produce List</caption>");out.print ("<thead><tr>");out.print ("<th>ID</th><th>Type</th><th>Name</th><th>Variety</th><th>Price</th>");out.println ("</tr></thead>");while (rs.next ()) {// Display the row of the database.out.print ("<tr>");out.print ("<td>" + rs.getString ("ID") + "</td>");out.print ("<td>" + rs.getString ("Type") + "</td>");out.print ("<td>" + rs.getString ("Name") + "</td>");out.print ("<td>" + rs.getString ("Variety") + "</td>");out.print ("<td>" +decimals (rs.getDouble("Price")) + "</td>");out.println ("</tr>");}out.println ("</table");Page.createFooter (out);} catch (ClassNotFoundException e){System.out.println ("Class Not Found exception.");} catch (SQLException e){System.out.println ("SQL Exception.");} catch (IOException ex) {System.out.println ("IO Exception.");}} // doGet// Formats a double for string output with two decimal places.public static String decimals (double num){DecimalFormat decFor = new DecimalFormat (); decFor.setMaximumFractionDigits (2); decFor.setMinimumFractionDigits (2);return decFor.format (num);} // method decimals} // class DisplayServletinsert.html<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head><title>Find an Item</title><link rel="stylesheet" type="text/css" href="choices-styles.css" /></head><body><h3>Add a Product</h3><form method = "get" action="http://localhost/servlet/produce.InsertServlet"><p><input type = "text" name = "id" value = "" size = 30 /> ID </p><p><input type = "text" name = "type" value = "" size = 30 /> Type </p><p><input type = "text" name = "name" value = "" size = 30 /> Name </p><p><input type = "text" name = "variety" value = "" size = 30 /> Variety </p><p><input type = "text" name = "price" value = "" size = 30 /> Price </p><p><input type="submit" value="Add Product" /></p></form></body></html>InsertServlet.javapackage produce;import java.sql.*;import java.io.*;import javax.servlet.*;import javax.servlet.http.*;/* InsertServlet gets data from the request and adds the product to the database. */public class InsertServlet extends HttpServlet{public void doGet (HttpServletRequest request, HttpServletResponse response) {try{PrintWriter out = response.getWriter ();Page.createHeader (out, "Insert a Product");// Get a jdbc-odbc bridge and connect to produce.mdb.Class.forName ("sun.jdbc.odbc.JdbcOdbcDriver");Connection con = DriverManager.getConnection ("jdbc:odbc:produce");String keyName = request.getParameter ("keyName");Statement stmt = con.createStatement ();int success = addProduct (out, con, request);if (success == 0) out.println ("<h3>Insert error.</h3>");else out.println ("<h3>Data inserted.</h3>");Page.createFooter (out);} catch (ClassNotFoundException e){System.out.println ("Class Not Found exception.");} catch (SQLException e){System.out.println ("SQL Exception.");}catch (IOException ex)


View Full Document
Download Study Notes
Our administrator received your request to download this document. We will send you the file to your email shortly.
Loading Unlocking...
Login

Join to view Study Notes and access 3M+ class-specific study document.

or
We will never post anything without your permission.
Don't have an account?
Sign Up

Join to view Study Notes 2 2 and access 3M+ class-specific study document.

or

By creating an account you agree to our Privacy Policy and Terms Of Use

Already a member?