时间:2022-10-01 02:40:45
摘要:该文对基于WEB的高校排课系统进行了分析和设计,提出了使用DWR框架设计实现AJAX 应用效果的实例解决方案,采用客户端脚本语言对服务器端远程调用技术完成动态显示功能,使用户在对网页操作的同时直接把结果保存到数据库中,简化了WEB项目开发的复杂性和难度,并给出动态 HTML 页面中部分代码和服务器端的设计方法。
关键词:AJAX;DWR;Javascript;web2.0;排课系统
中图分类号:TP311文献标识码:A文章编号:1009-3044(2011)24-5846-02
1 排课系统研究背景
排课系统作为标准化的教学管理工具,已经在很多高校得到了推广,但是,从软件开发的角度来看,绝大多数的软件都使用了C/S的模式开发的,如果要使用排课系统就必须在机器上安装客户端软件,这样的做法不仅仅是增加了客户端的系统运行成本,同时也使得一部分用户无法自由的使用排课系统软件,本系统改进了以上的不足,实现的主要功能有:
1) 无需安装客户端,通过浏览器直接访问。
2) 网页使用异步的交互方式,实现了与后台数据库的实时访问。
3) 使用数据库访问的三层模式,增强了系统的安全性。
2 DWR框架简介
简单地说 DWR 就是一个引擎可以把服务器端Java对象的方法暴露给Javascript代码(图1),使用DWR可以有效地从应用程序代码中把AJAX的全部请求-响应循环消除掉,这意味着客户端代码再也不需要直接处理XMLHttpRequest 对象或者服务器的响应。不再需要编写对象的序列化代码或者使用第三方工具才能把对象变成XML甚至不再需要编写Servlet代码把AJAX请求调整成对Java域对象的调用。
3 排课系统设计
3.1 排课系统概要设计
本系统主要针对高校教务管理工作,目标是提高工作效率,做到排课工作的公开公平,设计的核心工作是使用者在浏览器工具的基础上,完成对班级,课程,教师,教室的安排,安排的结果直接存储到数据库中,同时按照固定的教教室固定的时间固定的班级只能有唯一的一门课程这个基本原则,判断是否出现重复课程安排,一旦有重复的情况,在网页上显示错误提示信息通知用户更改。
3.2 数据库设计
在传统的数据库设计中首先业务分析人员与用户进行交流,因为用户心中有自己的模型;根据这些交流的结果,分析师建立一个逻辑模型。这就是典型的实体关系(Entity Relationship,ER)模型,它可以被用户否决从而重新设计。开发者然后根据这个模型增加烦琐的技术元素(诸如数据类型、索引等等),这将逻辑模型转化为一个物理模型。
为了能够简化表与表之间的关系,消除数据冗余,在设计的时候除了考虑到以上传统的因素以为,还考虑到了页面的完整性,在适当的情况下进行了一些数据的冗余,除了系,班级,课程等实体表,还加入了教师和课程表,课程表等关系表。
图2中详细说明了本系统的数据库结构图。
4 基于DWR框架实现排课系统
下面就以教学管理系统中的系部管理模块为例子,介绍DWR框架如何来实现选课功能。
4.1 要在web.xml中添加DWR的配置信息
dwr-invoker
org.directwebremoting.servlet.DwrServlet
dwr-invoker
/dwr/*
以上配置说明当有请求路径类似/dwr/*时,自动调用
org.directwebremoting.servlet.DwrServlet类来处理客户端请求。
4.2 在web.xml同目录下创建dwr.xml文件,将要被调用的java类写在里面
dwr.xml文档的根元素是dwr在这个元素内allow元素它指定dwr进行远程的类,allow两个子元素是create 和convert。
create元素负责把classHandle配置到了dwr中,creater="new"表示每调用一次classHandle时,需要new一个这样的类;javascript="classHandle",表示提供给前台页面调用的javascirpt文件是 classJs.js。
convert元素用于数据类型转换,即java类和javascript之间相互转换,因为和前台交换的是Class对象,因此需要对此使用bean转换。
从客户端远程调用classJs.loadClassByDepartId()
在设置可能的页面中,需要读取在同一个系内的所有班级的信息,并更新下拉列表框中的班级信息,其中classJs.loadClassByDepartId(id, showClass);这一行代码就是通过网络向DWRservlet发送XMLHttpRequest并用远程对象的响应调用服务器端的JAVA代码loadClassByDepartId(),这个函数本身的返回值是一个List集合,这个返回值交由代码showClass()来处理,此函数负责把数据库中提取出来的信息写入到PopUp的网页当中,方便用户的选择。
以下的代码显示了如何调用后台的JAVA代码,以及回调函数的使用
function initClassName() {
var id = document.getElementById("department").options[document
.getElementById("department").selectedIndex].value;
classJs.loadClassByDepartId(id, showClass);
}
function showClass(data) {
var result = ''; var strBr = ""; var brCount = 1;
for ( var i = 0; i < data.length; i++) {
document.getElementById("classNameDiv").innerHTML += ""
+ strBr;
}}
5 结束语
在DWR框架上开发的排课系统,全面采用SUN J2EE 的核心技术 (如 JSP,EJB),严格按照JSP,EJB 规范编写,因此能够在多种 WEB SERVER,应用服务器之间移植,具有良好的移植性。通过测试表明,系统具有良好的运行性能。同时大量采用模块设计,表示层与业务层分离开来,便于升级与维护。
在 Web开发中使用 AJAX 技术,减少了页面刷新的次数,按需获取数据,将原来一些服务器端的工作利用客户端闲置的能力来处理,从而减轻服务器端的负担,为用户带来了更好的体验。因此,随着Web应用的发展,AJAX技术将会得到更加广泛的应用。
参考文献:
[1] 柯自聪.Ajax开发简略[M].北京:电子工业出版社,2006.
[2] 张旗.浅析Ajax框架在Web系统中的开发与应用[J].科技广场,2008(8):221-223.
[3] 李刚.基于J2EE的Ajax宝典[M].北京:电子工业出版社,2007.
[4] 李瑞,伍新华.基于EXT的Java EE快速开发研究[J].软件导刊,2009,8(3):67-68.
[5] 鞠凤娟,吴志峰.EXT技术在Web界面设计与实现中的应用研究[J].计算机与现代化,2008(11):102-104.
[6] 徐会生,何启伟,康爱媛.深入浅出EXT JS[M].北京:人民邮电出版社,2009.
[7] 陈丽军,罗省贤,李敏.Ajax技术应用的研究[J].铁路计算机应用,2008,17(11):16-19.
[8] 梁斌,张更新,荣江.基于DWR与JST的Ajax技术的实现[J].石河子大学学报(自然科学版),2008,26(3):395-396.
[9] 严丽平,袁可风,宋凯.基于Ajax技术的Web应用开发研究[J].华东交通大学学报,2007,24(4):97-100.
注:本文中所涉及到的图表、注解、公式等内容请以PDF格式阅读原文