用DWR与Hibernate进行web开发

今天简单讲一下如何用Hibernate和DWR框架进行WEB开发。

1.用MyEclipse新建一个Web Project：dwr_hibernate。

2.用MySQL在test数据库建立一张表并填充一些数据，大概如下:

 

3.在myeclipse操作如下:

4.展开mysqldb,看到新建的emp表

5.切换到工程视图,在工程下新建一个vo包，存放hibernate的vo对象(映射emp表),我的工程包如下:

6.再切换到数据浏览器视图，操作如下：

7.切换到工程视图，添加hibernate支持:

如下对话框要设置一下，其他默认就行了:

8.按Finish后将在工程的vo包下生成一些java类。将其中的DAO类从vo包直接拖到dao包中。

9.在bo包中建立一个EmpBO类:

 

package  com.njsan.bo;

import  org.hibernate.Session;
import  org.hibernate.Transaction;

import  com.njsan.dao.EmpDAO;
import  com.njsan.vo.Emp;
import  com.njsan.vo.HibernateSessionFactory;

public   class  EmpBO  ... {
    EmpDAO empDAO=new EmpDAO();
    public String getEname(String empno)...{
        Emp emp=empDAO.findById(new Integer(Integer.parseInt(empno)));
        return emp.getEname();
    }
    
    public void insert(Emp emp)...{
        Session session=HibernateSessionFactory.getSession();
        Transaction transaction=session.beginTransaction();
        empDAO.save(emp);
        transaction.commit();
        HibernateSessionFactory.closeSession();
    }
}

10.修改web.xml:

 

<? xml version="1.0" encoding="UTF-8" ?>
< web-app  version ="2.4"  
    xmlns ="http://java.sun.com/xml/ns/j2ee"  
    xmlns:xsi ="http://www.w3.org/2001/XMLSchema-instance"  
    xsi:schemaLocation ="http://java.sun.com/xml/ns/j2ee 
    http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd" >
     < servlet >
         < servlet-name > dwr-invoker </ servlet-name >
         < servlet-class > org.directwebremoting.servlet.DwrServlet </ servlet-class >
         < init-param >
             < param-name > debug </ param-name >
             < param-value > true </ param-value >
         </ init-param >
     </ servlet >
     < servlet-mapping >
         < servlet-name > dwr-invoker </ servlet-name >
         < url-pattern > /dwr/* </ url-pattern >
     </ servlet-mapping >
</ web-app >

11.在WEB-INF目录下新建dwr.xml文件:

 

<? xml version="1.0" encoding="UTF-8" ?>
<! DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" 
"http://www.getahead.ltd.uk/dwr/dwr20.dtd" >
< dwr >
     < allow >
         < create  creator ="new"  javascript ="empbo" >
             < param  name ="class"  value ="com.njsan.bo.EmpBO" ></ param >
         </ create >
    
         < convert  converter ="bean"  match ="com.njsan.vo.*" ></ convert >
     </ allow >
</ dwr >

其中<convert converter="bean" match="com.njsan.vo.*"/>主要是将com.njsan.vo包下所有bean转换为js对象。

11.用两个jsp来测试一下:

search.jsp:按雇员编号来查找雇员姓名:

 

<% ... @ page language="java" import="java.util.*" pageEncoding="utf-8" %>
< html >
     < head >
         < title > DWR AND Hibernate </ title >
         < script  type ="text/javascript"  src ="dwr/engine.js" ></ script >
         < script  type ="text/javascript"  src ="dwr/util.js" ></ script >
         < script  type ="text/javascript"  src ="dwr/interface/empbo.js" ></ script >
         < script  type ="text/javascript" > ...
            function search()...{
                if($("empno").value!=null && $("empno").value!="")...{
                    empbo.getEname(document.getElementById("empno").value,
                    ...{callback:function(data)...{alert(data);},
                     timeout:5000,
                     errorHandler:function()...{
                         alert("没有此员工编号!");
                     }
                     });
                }else...{
                    alert("请输入员工姓名!");
                }
            }
         </ script >
     </ head >
     < body >
        请输入员工编号: < input  type ="text"  id ="empno" /> &nbsp;
         < input  type ="button"  value ="查找"  onclick ="search();" />
     </ body >
</ html >

 

12.add.jsp :向emp表中添加记录:

 

<% ... @ page language="java" import="java.util.*" pageEncoding="utf-8" %>
< html >
     < head >
         < title > DWR AND Hibernate </ title >
         < script  type ="text/javascript"  src ="dwr/engine.js" ></ script >
         < script  type ="text/javascript"  src ="dwr/util.js" ></ script >
         < script  type ="text/javascript"  src ="dwr/interface/empbo.js" ></ script >
         < script  type ="text/javascript" > ...
            function add()...{
                var emp=...{empno:$("empno").value,ename:$("ename").value,sal:$("sal").value};//直接定义对象，在dwr.xml中被转换成Bean
                empbo.insert(emp,...{
                    errorHandler:function()...{
                        alert("插入出错！");
                    }
                });
                alert("添加成功!");
            }
         </ script >
     </ head >
     < body >
        员工编号: < input  type ="text"  id ="empno" />< br />
        员工姓名: < input  type ="text"  id ="ename" />< br />
        薪水: < input  type ="text"  id ="sal" />   < br />
         < input  type ="button"  value ="添加"  onclick ="add()" />  
     </ body >
</ html >

 

13.将工程部署到tomcat中，打开浏览器,输入:

http://hostname:port/webapp/search.jsp或者http://hostname:port/webapp/add.jsp

测试一下，OK!