当前页面: 开发资料首页 → Java 专题 → jsp入门实例--多媒体教室上课预约单

jsp入门实例--多媒体教室上课预约单

摘要: jsp入门实例--多媒体教室上课预约单

</td> </tr> <tr> <td height="35" valign="top" class="ArticleTeitle">
本文将向你演示如何使用Apache Tomcat+JSP来制作多媒体教室上课预约单。
一、界面要求：
第周多媒体教室上课预约单
我要预约 <table width="56%" border=1> <tr> <td width="12%"> </td> <td width="12%">星期一</td> <td width="12%">星期二</td> <td width="12%">星期三</td> <td width="12%">星期四</td> <td width="13%">星期五</td> <td width="13%">星期六</td> <td width="14%">星期日</td> </tr> <tr> <td>第一节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第二节 </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第三节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第四节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第五节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第六节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第七节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>第八节</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table>

其中”我要预约”超链接到填写预约单的页面。

二、安装 Tomcat
先安装了Tomcat 之后，再设置我们的工作目录。
首先，在 c:\Tomcat 5.0\webapps 目录下创建一个名为 yyd 的子目录。然后在 yyd 子目录下，
创建标准的 Web 应用程序目录结构：
c:\Tomcat 5.0\webapps\yyd
c:\Tomcat 5.0\webapps\yyd\WEB-INF
c:\Tomcat 5.0\webapps\yyd\WEB-INF\classes
c:\Tomcat 5.0\webapps\yyd\WEB-INF\classes\dingdan
三、数据库设置
我们的预约单数据库用来存储教师的预约记录，打开Access,创建数据库dingdan,存盘保存在：
c:\Tomcat 5.0\webapps\yyd\WEB-INF\dingdan.mdb
在其中创建二十五个表：guestbook1,guestbook2,...guestbook25。每个表的结构一样，如下所示：

<table width="61%" border=1> <tr> <td>
字段说明</td> <td>字段</td> <td>数据类型</td> <td>是否能为空</td> </tr> <tr> <td>编号</td> <td>serial_no </td> <td>自动编号</td> <td>否</td> </tr> <tr> <td>姓名</td> <td>name</td> <td>文本</td> <td>否</td> </tr> <tr> <td>星期几</td> <td>week</td> <td>文本</td> <td>否</td> </tr> <tr> <td>第几节</td> <td>jie</td> <td>文本</td> <td>否</td> </tr> <tr> <td>上课课题</td> <td>content</td> <td>文本</td> <td>否</td> </tr> </table>

我们使用二十五个表对应一个学期的二十五个周，这样便于管理。当然也可用一个表。Week和jie字段用了文本类型。
四、设置数据源
以win2000为例，从控制面板的管理工具中打开“ODBC 数据源管理器”,单击”系统DSN”选项卡,在其中添加数据源dingdan,指向我们在上面创建的数据库dingdan.mdb。

五、多媒体教室上课预约单的文件结构
制作这个预约单将使用五个文件：
dingdan.jsp 选择周次的主文件。
index1.jsp 显示本周预约情况的jsp文件
Adddingdan.jsp 供老师填写的预约单
Okdingdan.jsp 将预约记录写入数据库
Dingdan.java 用于连接数据库

（1）Dingdan.jsp是供老师选择预约周次的jsp文件，并负责向index1.jsp传递参数。原码如下：
<%@page contentType="text/html;charset=gb2312" %>

<body>
多媒体教室上课预约单

<table border="0" width="103%" cellspacing="0" cellpadding="0" height="1">
<tr> <form name="guideform" action=index1.jsp target="_blank" method=”post”>
<select name="guidelinks">
<option SELECTED value="1">第一周
<option value="2">第二周
<option value="3">第三周
<option value="4">第四周
<option value="5">第五周
<option value="6">第六周
<option value="7">第七周
<option value="8">第八周
<option value="9">第九周
<option value="10">第十周
<option value="11">第十一周
<option value="12">第十二周
<option value="13">第十三周
<option value="14">第十四周
<option value="15">第十五周
<option value="16">第十六周
<option value="17">第十七周
<option value="18">第十八周
<option value="19">第十九周
<option value="20">第二十周
<option value="21">第二十一周
<option value="22">第二十二周
<option value="23">第二十三周
<option value="24">第二十四周
<option value="25">第二十五周
</select><input type="submit" name="go" value="Go!" </tr>
</table>
</body>

（2）index1.jsp用来显示本周的预约情况
一周的预约情况用一个数组week[][]记录，首先将数组赋初值：
for(int i=0;i<=8;i++)
for(int j=0;j<=7;j++)
week[i][j]=" ";
week[0][1]="星期一";
week[0][2]="星期二";
week[0][3]="星期三";
week[0][4]="星期四";
week[0][5]="星期五";
week[0][6]="星期六";
week[0][7]="星期日";

for(int i=1;i<=8;i++)
week[i][0]="第"+i+"节";
这个数组中其它元素的值从数据库中读出
Rs = showBean.executeQuery("SELECT * FROM guestbook"+sn1);
while(Rs.next()){
e1 = Rs.getString("week");
name1 = Rs.getString("name");
e2 = Rs.getString("jie");
int k=Integer.parseInt(e1);
int l=Integer.parseInt(e2);
week[l][k]=name1;
}
最后用一个表格显示week[][]。原代码如下：
<%@ page contentType="text/html;charset=gb2312" %>

<head>

多媒体教室上课预约单
<script LANGUAGE="javascript">
function newwin(url) {
var newwin=window.open(url,"newwin","toolbar=no,location=no,directories=no,
status=no,menubar=no,scrollbars=yes,resizable=yes,width=400,height=350");
newwin.focus();
return false;
}
</script>
</head>
<body bgcolor="#FFFFCC">
<script LANGUAGE="javascript">
function submit11()
{
self.location.replace("index1.jsp")
}
</script>

<%
String sn,sn1;
String e1;
String name1;
String e2;
String week[][]=new String[9][8];
int m1,m2;
sn=request.getParameter("guidelinks");
if(sn!=null) {
session.setAttribute("SN",sn);
sn1=(String)session.getAttribute("SN");
}else{
sn1=(String)session.getAttribute("SN");}
%>

第<%=sn1 %>周多媒体教室上课预约单

<%@ page language="java" import="java.sql.*" %>

<%

ResultSet Rs=null;

for(int i=0;i<=8;i++)
for(int j=0;j<=7;j++)
week[i][j]=" ";

week[0][1]="星期一";
week[0][2]="星期二";
week[0][3]="星期三";
week[0][4]="星期四";
week[0][5]="星期五";
week[0][6]="星期六";
week[0][7]="星期日";

for(int i=1;i<=8;i++)
week[i][0]="第"+i+"节";
try{
Rs = showBean.executeQuery("SELECT * FROM guestbook"+sn1);

while(Rs.next()){
e1 = Rs.getString("week");
name1 = Rs.getString("name");
e2 = Rs.getString("jie");
int k=Integer.parseInt(e1);
int l=Integer.parseInt(e2);
week[l][k]=name1;
}
Rs.close();
}catch(Exception e){
System.out.println(e.toString());
}
showBean.closeConn();
%>

      

<% out.print("我要预约 "); %>

</table>

某某制作

</body>

（3）add.jsp用来给教师填预约单并向ok_add.jsp传递表单数据。

原代码如下,函数valiform()用于客户端表单验证。
<%@page contentType="text/html;charset=gb2312" %>

<head>

预约单
<script LANGUAGE="JavaScript">
function valiform() {

if(document.form1.content.value==""){
alert("请输入课题！");
document.form1.content.focus();
return false;
}
else if(document.form1.name.value==""){
alert("请输入姓名！");
document.form1.name.focus();
return false;
}
else if(document.form1.week.value==""){
alert("请输入星期！");
document.form1.week.focus();
return false;
}
else if(document.form1.jie.value==""){
alert("请输入节次！");
document.form1.jie.focus();
return false;
}
}
</script>
</head>
<body>

预约单

预约单不能修改，请认真填写！

</form>
</body>

（4）ok_add.jsp文件将教师的预约数据写入数据库并刷新index1.jsp

<head>
<%@ page contentType="text/html;charset=gb2312" %>
保存数据
</head>
<%@ page language="java" import="java.sql.*" %>

<%
int i=0;
String name= new String(request.getParameter("name").getBytes("8859_1"));
String em= new String(request.getParameter("week").getBytes("8859_1"));
String em2= new String(request.getParameter("jie").getBytes("8859_1"));

String content= new String(request.getParameter("content").getBytes("8859_1"));
String sn=(String)session.getAttribute("SN");
String sql="select * from guestbook"+sn;
ResultSet rs=addBean.executeQuery(sql);
while(rs.next()){
String ee=rs.getString("week");
String ee1=rs.getString("jie");
if((em.equals(ee))&&(em2.equals(ee1))){
i=1;
break;
}

}
rs.close();
if(i==0){
String strSQL="insert into guestbook"+sn+" (name,week,jie,content) values('" + name + "','" + em + "','"+em2+"','" +
content + "')";

addBean.executeUpdate(strSQL);

out.print("您的预约内容已经保存到数据库中，谢谢！");
}else if(i==1){
if(em.equals("7")){ out.print("星期日"+"第"+em2+"节，有人预约，请您重新填单！！");
}else{
out.print("星期"+em+"第"+em2+"节，有人预约，请您重新填单！！");
}
}
addBean.close();
%>

<body onload="load2()">
<script language=javascript>
function load2(){
opener.setTimeout("submit11()",1500)
self.setTimeout("exit()",1500)
}
function exit(){
window.close()
}
</script>

</body>

</td> <td width="272"> </td> </tr> </table>

(5)dingdan.java文件用于连接数据库

package dingdan;

import java.sql.*;

public class dingdan {

  String sDBDriver = "sun.jdbc.odbc.JdbcOdbcDriver";

  String sConnStr = "jdbc:odbc:dingdan";

  private Connection conn = null;

  private Statement stmt = null;

  ResultSet rs = null;

  public dingdan() {

    try {

      Class.forName(sDBDriver);

    }catch(java.lang.ClassNotFoundException e) {

      System.err.println("dingdan(): " + e.getMessage());

    }

  }

 

  public ResultSet executeQuery(String sql) {

    try {

       conn = DriverManager.getConnection(sConnStr);

       stmt = conn.createStatement();

       rs = stmt.executeQuery(sql);

    }catch(SQLException ex) {

      System.err.println("aq1.executeQuery: " + ex.getMessage());

    }

    return rs;

  }

 

  public void executeUpdate(String sql) {

    stmt = null;

    try {

      conn = DriverManager.getConnection(sConnStr);

      stmt = conn.createStatement();

      stmt.executeUpdate(sql);

     }catch(SQLException ex) {

      System.err.println("aq2.executeQuery: " + ex.getMessage());

    }

  }

  public void closeStmt(){

    try{

      stmt.close();

     }

    catch(SQLException e){

      e.printStackTrace();

     }

  }

  public void closeConn(){

    try{

      conn.close();

     }

    catch(SQLException e){

      e.printStackTrace();

     }

  }

}

六、编译dingdan.java文件
为了使用dingdan.java，你必须用命令行 javac 编译器这个 .java 文件。
将已编译的dingdan.class 文件复制到先前创建的
c:\Tomcat 5.0\webapps\yyd\WEB-INF\classes\dingdan下。
七、运行
将dingdan.html,index1.jsp,add.jsp,ok_add.jsp四个文件放在c;\Tomcat 5.0\wepapps\ydd下，
启动Tomcat,在浏览器的地址栏中键入http://127.0.0.1:8080/ydd/dingdan.jsp。

</td> </tr> <tr>

↑返回目录
前一篇: 计算机单选题测试
后一篇: 给Access数据库配连接池Proxool