$("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"
onkeypress="DWRUtil.onReturn(event, submitFunction)"/>
<input type="button" onclick="submitFunction()"/>
分享到:
相关推荐
- **初始化变量**:定义一个变量`_data`用于存储回调函数中的数据。 - **设置同步模式**:使用`DWREngine.setAsync(false)`将DWR的默认异步模式切换为同步模式。 - **调用Java方法**:通过`JTest.getString...
5. **前端调用**:在JavaScript中,通过DWR生成的对象调用服务器端的方法,如同调用本地函数一样简单。 6. **后端调用前端**:DWR提供了`util.callRemoteMethod()`方法,允许服务器端主动调用客户端的JavaScript函数...
- **简单的回调函数**:介绍如何使用DWR进行异步调用,并在调用完成后执行回调函数。 - **调用元数据对象**:元数据对象包含关于服务和方法的信息,可以用来动态生成客户端调用代码。 DWR2.0中文文档不仅是一份详尽...
通过DWR框架,开发者可以将Java对象暴露给客户端JavaScript代码,并在客户端通过简单的函数调用来执行服务端的方法,从而极大地提高了Web应用的交互性和用户体验。 #### 二、DWR处理JavaBean示例 在DWR中处理...
1. **错误处理**:通过回调函数中的errorHandler属性来处理可能出现的错误。 2. **异常**:了解DWR可能抛出的各种异常类型及其含义。 3. **找出更多信息**:利用日志记录和其他调试工具来诊断问题。 **8.3 传递额外...
在"Dwr demo - Dwr简单使用"这个项目中,你可以通过以下步骤了解和学习DWR的基本用法: 1. **环境准备**:首先确保你有Eclipse IDE,并且已经安装了Java Development Kit (JDK)。由于DWR是一个Java库,所以你需要一...
- **集成DWR**: 将DWR框架加入到项目中,通常通过将DWR的jar包添加到项目的类路径中完成。 - **配置文件**: 编辑`web.xml`和`dwr.xml`文件,设置DWR的工作模式和各种参数。 ##### 1.2 HelloWorld示例 - **配置文件...
DWR允许前端JavaScript代码直接调用后端服务器的Java方法,就像它们是本地函数一样,这极大地增强了Web应用的交互性和实时性。DWR通过AJAX(异步JavaScript和XML)技术实现这一点,但并不局限于XML,它还支持JSON和...
在"**dwr反推简单例子**"中,我们将会探讨如何使用DWR进行数据的反向推送,即由服务器主动向客户端推送数据,而不仅仅是响应客户端的请求。 首先,DWR的核心概念包括三个主要部分:`Engine`、`Configuration`和`...
6. **批量调用与回调**:DWR支持批量调用多个服务器方法,并且可以在一个回调函数中处理所有结果。这对于处理大量数据或执行多个操作的场景非常有用。 7. **DWR的事件机制**:DWR提供了一套事件监听系统,允许你在...
Direct Web Remoting (DWR) 是一个开源Java库,它允许Web应用程序在浏览器和服务器之间进行实时、双向通信,使得JavaScript可以直接调用服务器端的Java方法,仿佛它们是本地函数一样。DWR使得开发富互联网应用程序...
在这个场景中,我们将讨论如何使用DWR来实现简单的文件上传功能。 文件上传是Web应用中常见的一种用户交互方式,通常涉及到前端的HTML表单、后端的处理逻辑以及可能的文件存储策略。DWR通过提供对Java方法的远程...
DWR通过提供一系列API和配置,使得在JavaScript中调用服务器端的Java方法变得简单。主要概念包括: - **Cascading Style Sheet (CSS) ID 映射**:DWR允许通过CSS选择器映射到服务器端对象,使JavaScript可以直接...
在这个"简单使用DWR完整例子"中,我们将深入理解DWR的基本概念、配置、以及如何在SSH(Spring、Struts、Hibernate)技术框架下集成和应用DWR。 首先,了解DWR的核心概念至关重要。DWR通过JavaScript API使得Java...
DWR的集合处理和JavaBean转换使得在Ajax应用中传递复杂数据结构变得简单。通过合理的配置和JavaScript的封装,开发者可以在不离开客户端页面的情况下,方便地与服务器进行数据交换,提高了Web应用的交互性和用户体验...
DWR简化了JavaScript与Java后端之间的交互,使开发者可以方便地调用远程服务器上的Java方法,就像它们是本地函数一样。下面我们将深入探讨DWR的工作原理、配置过程以及如何创建一个简单的测试例子。 1. DWR的工作...
在下拉菜单的`onchange`事件处理函数中,你可以使用这个函数传递当前选中的值,然后在回调函数中处理返回的新选项数据。 5. **更新下拉菜单**:当服务器返回新数据后,使用DWR的`DWRUtil.removeAllOptions`清除现有...
DWR的核心理念是将服务器端Java对象暴露给客户端JavaScript,这样JavaScript可以直接调用服务器端的方法,就像调用本地函数一样简单。这一过程涉及到了一系列的技术和优化: 1. **远程方法调用**:DWR实现了远程...