简单介绍一下DWR框架,首先DWR框架是Ajax的一个开源框架,目前流行的还有EXTJS,JODO,JQuery,Property等。
dwr的作用就是直接跨servlert或者是action 可以直接与DAO类进行交互,也就是说可以直接在JS里面调用DAO,这对于一个初学者来说,吸引不少呵呵, 下面就开始学习把!不,应该是应用了!
第一步:下载导入DWr.jar,common-logging.jar 这两个 jar包
第二步:配置dwr.xml 把他丢到WEB-INF 下
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr/dwr20.dtd">
<dwr>
<allow>
<!-- convert将bean的集合变成javascript中的对象数组-->
<convert match="com.vo.PicVO" converter="bean"></convert>
<!-- 业务处理类 -->
<!-- 获取说有的数据库图片列表 -->
<create creator="new" javascript="PicDAO" scope="session">
<param name="class" value="com.dao.PicDAO"/>
<!--这里是暴露你dao类里面的方法,
方法名就是我下面的,
当然你可以选择不暴露,
因为默认是暴露你全部的方法
我这里是选择你像暴露的那几个方法就可以了!-->
<include method="getPicList"/>
<include method="getInfoById"/>
</create>
</allow>
</dwr>
第三步:在web.xml里面配置dwr框架
<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>
这里如果你配置了struts2.0的话路径这里会与struts2.0的路径配置,有冲突的!以后我配置struts2.0与DWR的时候在讲!
可以了现在你可以发布你的工程,然后在你工程后面加上http://localhost:8080/PicAjax/dwr 他会有东西显示的,请看我附录里面的图。
ok!现在就到了如何在js里面调用了。
呵呵如何得到一个List?如何调用getInfoById(int id)它的返回值是vo?
下面的是重点:
第一步:导入这三个dwr系统自带的js文件
<scripttype='text/javascript' src='/PicAjax/dwr/interface/PicDAO.js'></script>
<script type='text/javascript' src='/PicAjax/dwr/engine.js'></script>
<script type='text/javascript' src='/PicAjax/dwr/util.js'></script>
第二步:
<script type="text/javascript">
function getTable(){
PicDAO.getPicList(callBack);
}
function callBack(data){
for(var i=0;i<data.length;i++){
var cell=[
function(data){
return data.picid;
},
function(data){
return data.picname;
},
function(data){
return data.picinfo;
},
function(data){
return data.picpath;
},
function(data){
var a=document.createElement("a");
a.setAttribute("href","javascript:edit("+data.picid+")");
var txt=document.createTextNode("编辑");
a.appendChild(txt);
return a;
}
];
}
if (typeof window['DWRUtil'] == 'undefined')
window.DWRUtil = dwr.util;
DWRUtil.addRows("tab",data,cell);
}
</script>
必须要有回调函数,这是与dao类交互的时候,系统会自动调用回调函数。
<body>
<table>
<tr>
<td>
图片编号
</td>
<td>
图片名称
</td>
<td>
图片信息
</td>
<td>
图片地址
</td>
<td>
是否编辑
</td>
</tr>
<tbody id="tab">
</tbody>
</table>
<input type="button" value="加载..." οnclick="getTable()">
因为dao里面返回的数据就是JSON类型的 所以在js客户端就使用JSON来解析,而VO就是对应的你在dwr.xml里面配置的bean
现在运行 看看是不是可以了??