DWR和HTML

<script type="text/javascript" src="js/jquery/jquery-1.2.6.pack.js"></script>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<script type='text/javascript' src='/t148-dwr/dwr/interface/myjs.js'></script>
<script type='text/javascript' src='/t148-dwr/dwr/engine.js'></script>
<script type='text/javascript' src='/t148-dwr/dwr/util.js'></script>
<!--
jquery和dwr共存
1.先导jquery
2.使用jquery不要使用$,用'jQuery'

-->
<table border="1" align="center" width="80%">
<thead>
<tr>

<th>
员工编号
</th>
<th>
员工姓名
</th>
<th>
员工部门
</th>
<th>
操作
</th>

</tr>
</thead>

<tbody id="mybody">

</tbody>

</table>
当前<span id="page"></span>页
共 <span id="count"></span>页

[url=javascript:fenye( 1 )]【首 页】[/url]
[url=javascript:fenye( jQuery('#page').html()-1 )]【上一页】[/url]
[url=javascript:fenye( 1*jQuery('#page').html()+1 )]【下一页】[/url]
[url=javascript:fenye( jQuery('#count').html() )]【尾 页】[/url]

<script>
onload = function()
{
fenye(1);
}


//分页显示员工方法
function fenye(page)
{

myjs.mypage(page,function(map){
//先删除表格中原来的内容
DWRUtil.removeAllRows("mybody");
DWRUtil.addRows("mybody",map.list,cell);
document.getElementById("page").innerHTML = map.page;
document.getElementById("count").innerHTML = map.count;
});
}

//定义列
var cell = [
function(e){return e.empId},
function(e){return e.empName},
function(e){return e.dep?e.dep.depName:"无部门"},
function(e){return "<a href=''>删除</a>"}
];
</script>


级联

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<script type='text/javascript' src='/t148-dwr/dwr/interface/myjs.js'></script>
<script type='text/javascript' src='/t148-dwr/dwr/engine.js'></script>
<script type='text/javascript' src='/t148-dwr/dwr/util.js'></script>

<select id="dep" name="dep" οnchange="change(this)">
</select>

<select id="emp" name="emp">
</select>


<script>
onload = function()
{
myjs.getAllDep(function(x){
DWRUtil.addOptions("dep",x,"depId","depName");
change( document.getElementById("dep") ); //注意位置
});


}

//obj就是部门对象
change = function(obj)
{
//删除所有员工
DWRUtil.removeAllOptions("emp");

//根据部门id查找员工集合
myjs.getEmpByDep(obj.value,function(x){
DWRUtil.addOptions("emp",x,"empId","empName");
});

}
</script>