`
ch_kexin
  • 浏览: 897909 次
  • 性别: Icon_minigender_2
  • 来自: 青岛
社区版块
存档分类
最新评论

dwrutil简介

    博客分类:
  • dwr
阅读更多
$("precloneNode1suf") 取得该对象;

DWRUtil.selectRange("selectRangeBasic", 5, 15) 选中selectRangeBasic文本框里面从第五个字符到第15个字符之间的字符.

DWRUtil._getSelection("selectRangeBasic") 得到selectRangeBasic文本框里选中的字符.

var arrayFive = [ 'One', 'Two', 'Three', 'Four', 'Five' ];
DWRUtil.addOptions('addOptionsBasic', arrayFive); 将数组添加到下拉菜单里面去;

DWRUtil.getValue('addOptionsBasic') 得到 addOptionsBasic 对象的值;
DWRUtil.getValue("precloneNode1Inner1suf", { textContent:true }); 后面加个参数,在 precloneNode1Inner1suf元素为"UL" 时,它返回了元素里面得值,也就是说去掉了HTML标签部分.

DWRUtil.getText('addOptionsBasic') 得到下拉框 addOptionsBasic 显示的文本;

var arrayObject = [
{ name:'One', value:'1' },
{ name:'Two', value:'2' },
{ name:'Three', value:'3' },
{ name:'Four', value:'4' },
{ name:'Five', value:'5' }
];
DWRUtil.addOptions('addOptionsObject1', arrayObject, "name"); 将数组添加到下拉菜单里面去;后面的参数是确定那个是给用户显示的文本,同时也是值;

DWRUtil.addOptions('addOptionsObject1', arrayObject, "name","value"); 同上,不过后面参数是: 3=文本;4=值;

var map = { one:1, two:2, three:3, four:4, five:5 };
DWRUtil.addOptions('addOptionsMap1', map); 同上, one 是值;1 是文本;
DWRUtil.addOptions('addOptionsMap1', map,true); 同上, 1 是值;one 是文本;

-------------------------------------------------------------------------------------
<ul id="removeItems">
<li>One</li><li>Two</li><li>Three</li><li>Four</li><li>Five</li>
</ul>

如果是列表显示,如上;则上面所有方法和select 下拉框使用一样;
-------------------------------------------------------------------------------------
DWRUtil.cloneNode('cloneNode1', { idPrefix:'pre', idSuffix:'suf' });克隆一个节点,参数一为要克隆的节点的id,第二个参数是在克隆的节点id前面加pre,后面加suf.(注意:如果该节点有子节点的话,子节点的名字也一样加)

DWRUtil.addRows(id, array, cellfuncs, [options]);
原理:

for each member in array
for each function in cellfuncs
create cell from cellfunc(array[i])
循环数组,循环函数,建立单元调用函数;(顺序决定)

例如:
DWRUtil.addRows('addRowsBasic', arrayFive, [
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 "<input type='button' value='innerHTML Test' onclick='alert(\"" + data + "\");'>"; }
]);

高级部分:
第四个参数为对单元的高级操作,主要下面的两个方法;
function defaultRowCreator(options) {
return document.createElement("tr");
};

function defaultCellCreator(options) {
return document.createElement("td");
};

例子:
DWRUtil.addRows( "demo2",[ 'Africa', 'America', 'Asia', 'Australasia', 'Europe' ] , cellFuncs, {
rowCreator:function(options) {
var row = document.createElement("tr");
var index = options.rowIndex * 50;
row.style.color = "rgb(" + index + ",0,0)";
return row;
},
cellCreator:function(options) {
var td = document.createElement("td");
var index = 255 - (options.rowIndex * 50);
td.style.backgroundColor = "rgb(" + index + ",255,255)";
td.style.fontWeight = "bold";
return 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)


DWRUtil.setValues(); 批量设置值;
var settings = {
setValuesDiv:"setValuesDiv",
setValuesSpan:"setValuesSpan",
setValuesSelect:"two",
setValuesText:"setValuesText",
setValuesPassword:"AB",
setValuesTextarea:"setValuesTextarea",
setValuesButton1:"B1-Two",
setValuesButton2:"B2-Two",
setValuesRadio1:true,
setValuesRadio2:false,
setValuesRadio3:"one",
setValuesRadio4:"two",
setValuesCheckbox1:true,
setValuesCheckbox2:false
};
DWRUtil.setValues(settings);

DWRUtil.getValues(empty);批量获取值;
var empty = {
setValuesDiv:null,
setValuesSpan:null,
setValuesSelect:null,
setValuesText:null,
setValuesPassword:null,
setValuesTextarea:null,
setValuesButton1:null,
setValuesButton2:null,
setValuesRadio1:null,
setValuesRadio2:null,
setValuesRadio3:null,
setValuesRadio4:null,
setValuesCheckbox1:null,
setValuesCheckbox2:null
};
DWRUtil.getValues(empty);

DWRUtil.useLoadingMessage("Ping");//类似gmail那个样子,在右上角显示加载"ping";可用自定样式,具体查询;http://getahead.ltd.uk/dwr/browser/util/useloadingmessage

DWRUtil.toDescriptiveString("id",数字);弹出调试信息,数字为0,1,2.一级比一级高.

DWRUtil.onReturn(event, submitFunction);一般在form表单里面,防止在文本框上按回车就提交表单.
例如:
<input type="text"

分享到:
评论

相关推荐

    使用dwr的一点经验

    #### 一、DWR简介 DWR(Direct Web Remoting)是一种简化Ajax应用开发的技术,它使得JavaScript可以直接调用Java服务端方法,从而避免了传统Ajax开发中需要手动处理JSON数据的问题。DWR不仅简化了开发流程,还提高...

    dwr-下拉菜单实现

    #### DWR简介 DWR是一种简化Ajax应用开发的Java库,它允许在浏览器端直接调用服务器端的方法,从而实现了更简洁高效的前后端交互方式。通过DWR,前端开发者可以像调用本地JavaScript函数一样轻松地调用后端服务,极...

    dwr学习总结dwr学习总结

    #### 一、DWR简介与版本变迁 DWR(Direct Web Remoting)是一个开源项目,它简化了服务器端Java对象与客户端JavaScript脚本之间的交互过程。通过DWR,开发者可以直接调用服务器端的方法就像调用客户端本地方法一样...

    dwr3初学者使用说明

    #### 一、简介 Direct Web Remoting(简称DWR)是一种开源技术,它使得JavaScript能够直接调用Java方法变得简单。DWR3是DWR的一个版本,它提供了更为丰富的功能和更好的性能。本文档旨在帮助初学者快速搭建并配置一...

    dwr技术及配置方案 大家一看便知

    #### 一、DWR技术简介 DWR(Direct Web Remoting)是一种Java技术,它使得JavaScript能够直接调用服务器端的Java方法,从而简化了Ajax应用程序的开发过程。DWR的核心思想是将服务器端的方法暴露给客户端,通过...

    ajax+dwr的一个简单例子

    **Ajax和DWR简介** Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新,提升了用户体验,使得...

    个人编写的一份dwr入门源代码

    1. **DWR简介**:DWR简化了AJAX开发,通过自动处理跨域问题和JSON/JavaScript对象转换,使得前端可以像调用本地方法一样调用服务器端的Java方法。这种远程调用机制极大地提高了Web应用的响应速度和用户体验。 2. **...

    学习dwr的一个例子

    1. **DWR简介**:DWR的核心功能是通过AJAX技术实现浏览器与服务器之间的双向通信。它提供了一种简单的方式来执行异步请求,使得前端JavaScript代码可以调用后台Java方法,仿佛它们是在同一进程中运行一样。 2. **...

    ajax dwr+spring整合

    在客户端,通过DWR提供的API(如`DWRUtil`或`DWREngine`)可以直接调用服务器端的Java方法,DWR会自动处理网络通信和数据转换。 **四、实战案例** 在"dwrspring2"这个示例项目中,可能包含了配置文件、Java源代码...

    ssh+dwr自动补全

    DWRUtil.removeAllOptions(autoULId); if (child != null && value == child.innerHTML) { return; } if (value == "") { return; } child = null; if (list.length &gt; 0) { $(autoULId).style.display = ...

    springMVC3集成DWR3

    1. **DWR3简介** - DWR3是DWR的第三个主要版本,提供了一个安全、高性能的机制来调用服务器端的Java方法,并将结果直接返回到JavaScript对象。 - DWR支持Ajax通信,允许用户在不刷新整个页面的情况下更新部分页面...

    Spring与DWR集成

    DWR简介** DWR的主要目的是消除Web应用中的AJAX复杂性,提供简单易用的API来实现在客户端和服务器端之间的异步通信。DWR的核心概念包括远程接口(Remote Interface)、映射器(Mapper)和引擎(Engine)。远程接口...

Global site tag (gtag.js) - Google Analytics