导读:
新一篇: 文本框内容可以删除,就是不想让用户手工写入我在使用DWR时,试了很多次都无法在动态生成的table中的一个或多个td中进行动态链接,后来才发现原来在cellfuncs中覆盖了我想定义的输出,不过无意中让我发现了可以用下面的方法来处理(http://www.yumt.com/aeonsun)。
方法如下:
DWRUtil.addRows(id, array, cellfuncs, [options]);
这个函数估计调用的人很多,而且现在支持直接将对象传给这个函数,这就方便了许多(以前只能是数组),而且cellfuncs的功能也很强大,一般都会省略options参数(这个参数只用做定义CSS或其它特殊使用,我这里就是在这个参数里做动态链接的处理)。
下面就是处理代码:
DWRUtil.addRows('testid', myObject, [
function(data) { return data.name; },
function(data) {
//return data.id;
//通常都会在这里直接返回处理的数据,如果要实现动态多链接,
//那么这里就什么都别输出(当然也可以输出,但这里所有的html标记都会直接显示在页面上,
//无法进行解析)
//doNothing
}],
{rowCreator:function(options) {
return document.createElement("tr");
},
cellCreator:function(options) {
if(options.cellNum==1){
var td = document.createElement("td");
td.setAttribute("align","center");
var thtml = " '"+options.rowData.testId+"');\">删除";
td.innerHTML = thtml;
return td;
}else{
return document.createElement("td");
}
}
});
cellfuncs中的处理相当重要,当直接返回值时,会影响[options]参数中的处理内容(比如options中要
加入的TD内容会无效,当然,td.setAttribute("align","center")等是有效的)。
对DWRUtil.addRows(id, array, cellfuncs, [options])的补充:
其中:
id是table元素的id,最好使用tbody
array数据,从1.1开始支持对象
cellfuncs: 函数数组,从传递过来的行数据中提取单元格数据。
如:
var cellfuncs = [
function(data) { return data; },
function(data) { return data.toUpperCase(); },
function(data) {
var input = document.createElement("input");
input.setAttribute("type", "button");
input.setAttribute("value", "DOM Test");
input.setAttribute("onclick", "alert('" + data + "');");
return input;
},
function(data) { return ""; }
]
注意:这里定义的数组size表示td的数量,面data就是array的引用,如果使用convert转换过bean,那么可以直接调用属性。
[options]:这个最为有用,也是这里所要说的重点,包含两个对象
rowCreator: 一个用来创建行的函数(例如,你希望个tr加个css). 默认是返回一个document.createElement("tr")
cellCreator: 一个用来创建单元格的函数(例如,用th代替 td). 默认返回一个document.createElement("td")
一般都用不到这个参数,但对于有特殊要求的朋友来说,这就成了重点
定义的例子如下:
var custoptions = {rowCreator:function(options) {
return document.createElement("tr");
},
cellCreator:function(options) {
if(options.cellNum==1){
var td = document.createElement("td");
td.setAttribute("align","center");
var thtml = "删除";
td.innerHTML = thtml;
return td;
}else{
return document.createElement("td");
}
}
}
其中 options 参数的属性可用的为:
rowData: the element value from the array (the same for all cells in a row)
rowIndex: the key (if map) or index (if array) from the collection
rowNum: The row number counting from 0 in this section (so if you are using tbody, it counts rows in the tbody and not the whole table)
data: The 'computed' data value for the cell (cellCreators only)
cellNum: The cell number that we are altering counting from 0 (cellCreators only)
我在上面用到了rowNum、rowData属性
最后还是说一句,DWR太伟大了,让我这个不懂JS的人也可以轻松上阵。
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/zxl315/archive/2008/05/26/2484170.aspx
分享到:
相关推荐
一个Dwr的小例子 是一个table的显示问题,sqlserver2005数据库
dwr城市选择的联动,util.js方法的使用,动态table
SSH CRM项目DWR入门源码(4)通过DWR实现动态树源码(5) var sjzdflArr; DWREngine.setAsync(false); SjzdflDAO.findAll(load); DWREngine.setAsync(true); function load...
DWR 框架使用手册DWR 框架使用手册DWR 框架使用手册DWR 框架使用手册DWR 框架使用手册DWR 框架使用手册
DWR采取了一个类似AJAX的新方法来动态生成基于JAVA类的JavaScript代码.这样WEB开发人员就可以在JavaScript里使用Java代码就像它们是浏览器的本地代码(客户端代码)一样;但是Java代码运行在WEB服务器端而且可以自由...
// 绑定高度并获得当前隐藏keys(获得当前事件的下一个元素) /** * 显示状态和模块 */ /** * 隐藏状态和模块 */ /** * 动态创建层并添加显示内容 改分页 */ /** * DWR 提交 */ /** * 分页函数 ...
NULL 博文链接:https://congpeixue.iteye.com/blog/258256
DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤DWR使用步骤
dwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwrdwr dwr
dwr 框架dwr 框架dwr 框架dwr 框架dwr 框架dwr 框架
该例子很好的介绍了dwr的使用,是一个完整的例子,在ssh技术框架下使用!
配置和使用DWR进行Ajax开发
DWR(Direct Web Remoting)是一个web远程调用框架,利用这个框架可以让AJAX变得很简单,通过DWR可以在客户端通过JavaScript直接调用服务器的Java方法并返回值给JavaScript,整个过程就好像通过本地客户端调用一样,...
DWR小测试DWR小测试DWR小测试DWR小测试
简单DWR动态下拉菜单
本项目实现了使用DWR框架实现二级联动,并且实现了从服务器端提取数据集(list),使用表格动态显示到页面上的无刷新效果。附带两个验证码Servlet类(供相关项目参考),附带数据库
dwr的简单使用,是一个Eclipse的项目,直接导进去就可以看到使用的方式了 对于初学者这个应该是不错的demo哦~
使用DWR开发AJAX For J2EE
使用dwr进行后台交互的j2ee小demo
用DWR实现的一个树形..希望大家喜欢 .. 呵呵