浏览 3352 次
|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2009-12-02
最后修改：2009-12-02
最近在学习DWR，感觉engine.js中的DWRUtil.addRows()方法比较麻烦，重写了一下，容错性比原方法差些，但实现简单了
在页面中列出CllxInfo类的属性值 1.JAVA中的service类
public interface CllxInfoService {
List<CllxInfo> findAll( ); //查询后返回的是List数组
}
2.POJO类
public class CllxInfo implements java.io.Serializable {
private static final long serialVersionUID = -2096185L;
private Integer oid; //数据库中的主键
private String dm;
private String mc;
}
3.index.jsp
<%@ page language="java" pageEncoding="gb2312"%>
<%@page isELIgnored="false" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>维护车辆类型代码表</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script type="text/javascript" src="../js/engine.js"></script> //不必使用eneign.js
<script type="text/javascript" src="../js/right.js"></script> //js文件
<script type="text/javascript" src="${pageContext.request.contextPath}/dwr/interface/cllxInfoService.js"></script>
<script>
var key="oid";//实体类中的主键
var service=cllxInfoService;//引入DWR中配置的service
var attributes=["dm","mc"];//表中要显示的属性
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table border="1" cellpadding="0" >
<tr class="head">
<td align="center">行 号</td>
<td align="center">代码</td>
<td align="center">名称</td>
</tr>
<tbody id="table"></tbody> //查询到的数据将加载到此<tbody>中,其id为"table"
</table>
<script type="text/javascript">loadData();</script>//页面加载到此后调用DWR请求加载表格
</body>
</html>
4.right.js
/**
* 加载数据，并设置加载后的处理方法
*/
function loadData(){
dwr.engine.setPostHook(function(){
//调用后的处理函数，如修改加载条为不可见
});
service.findAll(addRows);
}
/**
*以下三个方法结合用于取代DWRUtil.addRows方法
* @param {} arr 对象数组
*/
function addRows(arr){
var table = document.getElementById("table");
var length =arr.length;
for(var i=0;i<length;i++){
var tr =createTr(arr[i]);
table.appendChild(tr);
}
initTable(); //加载数据完成后初始化行号
}
/**
* 生成一行表格（可在此修改表格的样式）
* @param {} bean 对象
* @return {} 一行表格
*/
function createTr(bean){
var tr =document.createElement("tr");
tr.onclick=setValue;
tr.ondblclick=xiugai;
tr.id=bean[key];
tr.appendChild(createTd()); //第一个单元格内容为空,用于显示行号
tr.align="center";
for(var i =0,length=attributes["length"];i<length;i++){
var attrStr =attributes[i];
tr.appendChild(td);
}
return tr;
}
/**
* 生成单元格（可在此修改表格的样式）
* @param {} value 值
* @return {} 单元格
*/
function createTd(value){
var td = document.createElement("td");
if(value==null){
}else{
td.innerHTML=value;
}
return td;
}
/**
* 给表格赋行号
* 行号为表格的第一列
*/
function initTable(){
var table = document.getElementById("table");
var rows =table.rows;
var length =rows.length
for(var i=0;i<length;i++){
var div =rows[i].cells[0].innerHTML=(i+1);
}
}
第一次发帖，请高手指正 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
