JSP

实验目的：掌握在JSP中编辑数据库的方法

本次实验使用Access数据库Northwind.mdb的英文版或中文版，实现雇员表Employees的编辑功能（添加/更新/删除），该表包含的必填字段如下：

英文版字段名	中文版字段名	数据类型和长度	说明
EmployeeID	雇员ID	自动编号	主键
LastName	姓氏	文本(20)
FirstName	名字	文本(10)
Title	职务	文本(30)

1 编辑记录

本例以JDBC-ODBC桥接方式连接数据库编辑雇员表。

所有编辑功能采用弹出模态窗口的形式以方便操作，在主页面中添加JavaScript客户端脚本（这里为简化脚本的编写而引入了JavaScript库jQuery），为所有popup类元素的单击事件添加处理函数）：

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(".popup").click(function() {
        showModalDialog($(this).attr("href"), window, "status:0;dialogWidth:" + $(this).data('width') + ";dialogHeight:" + $(this).data('height'));
        return false;
    });
});
</script>

一、创建主页面main.jsp，添加代码查询雇员表：

<%
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
Connection conn = DriverManager.getConnection("jdbc:odbc:Driver={Microsoft Access Driver (*.mdb)};DBQ=d:/Northwind.mdb");
Statement stmt = conn.createStatement();
ResultSet rs = stmt.executeQuery("SELECT * FROM Employees");
%>

然后以表格形式输出所有记录，加上添加/修改/删除链接（修改和删除链接都要传递雇员号作为参数，而ODBC驱动不允许多次读取同一字段，因此取出雇员号字段值后先赋值给变量）：

<table border="1">
<tr>
<th>雇员号</th>
<th>姓</th>
<th>名</th>
<th>职位</th>
<th><a class="popup" data-width="400px" data-height="150px" href="add.jsp">+ 添加</a></th>
</tr>
<%
while (rs.next()) {
%>
<tr><% String EmployeeID = rs.getString("EmployeeID"); %>
<td><%= EmployeeID %></td>
<td><%= rs.getString("LastName") %></td>
<td><%= rs.getString("FirstName") %></td>
<td><%= rs.getString("Title") %></td>
<td>
<a class="popup" data-width="400px" data-height="150px" href="edit.jsp?EmployeeID=<%= EmployeeID %>">修改</a>
<a class="popup" data-width="400px" data-height="150px" href="del.jsp?EmployeeID=<%= EmployeeID %>">删除</a>
</td>
</tr>
<%
}
%>
</table>

二、创建添加记录页面add.jsp，加入表单用文本域提交姓/名/职位信息，使用以下代码根据表单提交的参数插入新记录（添加记录后刷新主页面并关闭本页面）

<%  
request.setCharacterEncoding("utf-8");
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
Connection conn = DriverManager.getConnection("jdbc:odbc:Driver={Microsoft Access Driver (*.mdb)};DBQ=d:/Northwind.mdb");
Statement stmt = conn.createStatement();
String LastName = request.getParameter("LastName");
String FirstName = request.getParameter("FirstName");
String Title = request.getParameter("Title");
if (LastName != null && FirstName != null && Title != null) {
    stmt.executeUpdate("INSERT INTO Employees (LastName, FirstName, Title) VALUES ('" + LastName + "', '" + FirstName + "', '" + Title + "')" );
%>
    <script type="text/javascript">
    window.opener.location.reload();
    window.close();
    </script>
<%
}
%> 

三、创建修改记录页面edit.jsp，根据雇员号参数查询雇员信息在表单中显示并允许编辑（使用文本域的value属性即可），使用以下代码根据表单提交的参数修改记录（修改记录后刷新主页面并关闭本页面）

<%  
request.setCharacterEncoding("utf-8");
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
Connection conn = DriverManager.getConnection("jdbc:odbc:Driver={Microsoft Access Driver (*.mdb)};DBQ=d:/Northwind.mdb");
Statement stmt = conn.createStatement();
String EmployeeID = request.getParameter("EmployeeID");
String LastName = request.getParameter("LastName");
String FirstName = request.getParameter("FirstName");
String Title = request.getParameter("Title");
if (LastName != null && FirstName != null && Title != null) {
    stmt.executeUpdate("UPDATE Employees SET LastName='" + LastName + "', FirstName='" + FirstName + "', Title='" + Title + "' WHERE EmployeeID=" + EmployeeID);
%>
<script type="text/javascript">
    window.opener.location.reload();
    window.close();
    </script>
<%
}
ResultSet rs = stmt.executeQuery("SELECT * FROM Employees WHERE EmployeeID=" + EmployeeID);
rs.next();
%>

四、创建删除记录页面del.jsp，根据雇员号参数查询雇员信息在表单中显示（不允许编辑），使用以下代码根据完成删除操作（删除记录后刷新主页面并关闭本页面）

<%  
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
Connection conn = DriverManager.getConnection("jdbc:odbc:Driver={Microsoft Access Driver (*.mdb)};DBQ=d:/Northwind.mdb");
Statement stmt = conn.createStatement();
String EmployeeID = request.getParameter("EmployeeID");
String del = request.getParameter("del");
if (del != null) {
    stmt.executeUpdate("DELETE FROM Employees WHERE EmployeeID=" + EmployeeID);
%>
    <script type="text/javascript">
    window.opener.location.reload();
    window.close();
    </script>
<%
}
ResultSet rs = stmt.executeQuery("SELECT * FROM Employees WHERE EmployeeID=" + EmployeeID);
if (rs.next()) {
%>
<body>
<form id="form1" name="form1" method="post" action="">
    <table width="360" border="1">
        <tr>
            <td>姓：</td>
            <td><%= rs.getString("LastName") %></td>
        </tr>
        <tr>
            <td>名：</td>
            <td><%= rs.getString("FirstName") %></td>
        </tr>
        <tr>
            <td>职位：</td>
            <td><%= rs.getString("Title") %></td>
        </tr>
        <tr>
            <td><input name="del" type="hidden" id="del" value="yes" /></td>
            <td><input type="submit" name="button" id="button" value="确定删除" /></td>
        </tr>
    </table>
</form>
</body>
<%
}
%>

2 编辑记录（DW自动生成代码）

本例使用Dreamweaver的服务器行为自动生成代码来实现雇员表的编辑功能（注意：CS3及以下版本的DW不支持中文字段名）。

一、创建主页面index.jsp，参照教学6.4，完成显示雇员表功能：

“+ 添加”文本链接到添加记录页面insert.jsp，“修改”和“删除”文本分别添加“转到详细页面”服务器行为，目标分别是修改记录页面update.jsp和删除记录页面delete.jsp 

二、创建添加记录页面insert.jsp，加入表单用文本域提交姓/名/职位信息，添加“插入记录”服务器行为即可（注意设置请求信息的字符编码以支持提交中文：<% request.setCharacterEncoding("utf-8"); %>）

三、创建修改记录页面update.jsp，根据雇员号参数查询雇员信息在表单的文本域中显示，添加“更新记录”服务器行为即可（注意设置请求信息的字符编码以支持提交中文：<% request.setCharacterEncoding("utf-8"); %>）

四、创建删除记录页面delete.jsp，根据雇员号参数查询雇员信息在表单中显示，添加“删除记录”服务器行为即可