DWR中的util.js的运用-处理表格
日期：2014-05-16 浏览次数：20334 次
DWR中的util.js的使用----处理表格
util.js测试一（动态添加表格），使用dwr.util.addRows(tableId,array,funArray,[option])
util.js测试一（动态添加表格），使用dwr.util.addRows(tableId,array,funArray,[option])
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>util.js测试一（动态添加表格）</title>
<meta name="website" content="http://www.crazyit.org" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="js/util.js" type="text/javascript"></script>
</head>
<body>
<table width="400" border="1">
<tr>
<th>
城市
</th>
<th>
国家
</th>
<th>
洲
</th>
</tr>
<tbody id="test"></tbody>
</table>
<input type="button" value="添加行" onclick="add();"/>
<input type="button" value="删除行" onclick="del();"/>
<script type="text/javascript">
//定义一个字符串数组，每个数组元素对应表格一行
var rowArr = [ '广州', '华盛顿', '伦敦' ];
//定义一个函数数组，每个函数对于表格内的一列
var cellfuncs = [ function(data) {
return data;
}, function(data) {
if (data == '广州')
return '中国';
if (data == '华盛顿')
return '美国';
if (data == '伦敦')
return '英国';
}, function(data) {
if (data == '广州')
return '亚洲';
if (data == '华盛顿')
return '欧洲';
if (data == '伦敦')
return '欧洲';
} ];
//为表格增加行
function add() {
dwr.util.addRows("test", rowArr, cellfuncs);
}
//删除表格内的所有行
function del() {
dwr.util.removeAllRows("test");
}
</script>
</body>
</html>
?util.js测试二（动态添加表格）
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>util.js测试二（动态添加表格）</title>
<meta name="website" content="http://www.crazyit.org" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="js/util.js" type="text/javascript"></script>
</head>
<body>
<table width="400" border="1">
<tr>
<th>
国家
</th>
<th>
城市一
</th>
<th>
城市二
</th>
<th>
城市三
</th>
</tr>
<tbody id="test"></tbody>
</table>
<input type="button" value="添加行" onclick=add();; />
<input type="button" value="删除行" onclick=del();; />
<script type="text/javascript">
//定义一个二维数组，用于在表格中输出
var rowArr = [ [ '中国城市：', '广州', '上海', '北京' ],
[ '美国城市：', '加州', '华盛顿', '纽约' ], [ '英国城市：', '利物浦', '伦敦', '伯明翰' ] ];
var cellfuncs = [
//表格函数，每个函数对应表格的一列。
//系列函数的data都是rowArr数组的元素——每个数组元素都是一维数组
function(data) {
return data[0];
}, function(data) {
return data[1];
}, function(data) {
return data[2];
}, function(data) {
return data[3];
} ];
//添加表格行
function add() {
dwr.util.addRows("test", rowArr, cellfuncs);
}
function del() {
dwr.util.removeAllRows("test");
}
</script>
</body>
</html>
?util.js测试三（动态添加表格），使用dwr.util.addRows(tableId,array,funArray,[option])，使用第四个参数
<%@ page language="java" import="java.util.*" pageEncod
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
