存档: 标签: ‘DWR’

RichFaces 简介

1条评论 2010年5月1日

RichFaces是一个在JSF基础上增加Ajax的功能的组件库,你只需要使用RichFaces的一些标签就可以获得实现ajax的异步刷新的功能,而无需在页面上写任何Javascript的代码。
Rich Faces 利用了JSF框架的验证机制、生命周期管理机制、管理动态与静态资源机制并把Ajax支持及高度的外观和风格的可定制化与JSF框架很好的结合在一起。
RichFaces可以定义(依靠JSF标签)希望通过AJAX请求更新JSF页面的不同部分,并且提供的一些发送AJAX请求到服务器端的选项。并且新的JSF页面也不会改变的原来“正规” JSF的页面,你不需要用手写任何JavaScript或的XMLHttpRequest对象的代码,一切都是自动完成。 继续阅读…

Ajax 中的utils.js工具

没有评论 2009年6月22日
?View Code JAVASCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function createXhr(){
	if(window.ActiveXObject){
		return new ActiveXObject("Microsoft.XMLHTTP");
	}else if(window.XMLHttpRequest){
		return new XMLHttpRequest();
	}else{
		throw new Error("Does not ajax programming");
	}
}
 
function $(id){
	return byId(id);
}
 
function byId(id){
	return document.getElementById(id);
}
 <a href="http://www.javachen.com/2009/06/ajax_util-js/#more-427" class="more-link">继续阅读...</a>

获取XMLHttpRequest的步骤

没有评论 2009年6月22日

step 1: trigger an event to call a javascript function
step 2. create XMLHttpRequest Object
step 3. open a web resource
step 4. register a callback on xhr
step 5. send request
继续阅读…

First Ajax Example

没有评论 2009年6月22日

hello.html页面:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>First Ajax Program</title>
<link rel="stylesheet" type="text/css" href="css/hello.css" />
		<script type="text/javascript " src="js/hello.js">
		</script>
	</meta></head>
	<body onload=init()>
<div id="hello">
			My first ajax program
		</div>
<div id="empty"></div>
 
	</body>
</html>

hello.js文件:

?View Code JAVASCRIPT
1
2
3
4
5
6
7
8
9
10
function init(){
	var hello = document.getElementById("hello");
	var empty = document.getElementById("empty");
 
	hello.className = "declared";
	empty.innerHTML = "Programmed ajax string";
	empty.className = "programmed";
	empty.style.border = "solid green 2px";
	empty.style.width = "200px";
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
@CHARSET "UTF-8";
.programmed {
	color: red;
	font-family: system;
	font-style: bold;
	font-size: 24px
}
 
.declared {
	color: blue;
	font-family: arial;
	font-style: normal;
	font-size: 36px
}

效果图:
sendpix0

ajax入门指南

没有评论 2009年6月20日

1.AJAX兼容IE和Firefox两大浏览器,出现了AJAX开发框架.
2.AJAX开发关键技术:XMLHttpRequest对象,JavaScript编程技术,DOM(文档对象模型),CSS(层叠样式表),和XSLT(可扩展样式表转换)      
XMLHttpRequest对象是实现Ajax应用的核心;
     JavaScript是Ajax应用在客户端使用的脚本语言;
     通过JavaScript和DOM的配合才能实现页面的动态更新;
     CSS主要用于控制页面元素的显示样式;
     XSLT可以将XML文档转换为任何形式的文档,在Ajax应用中使用XSLT可以实现数据和页面显示的完全分离;

3.XMLHttpRequest对象:
 3.1 发送请求
      使用XMLHttpRequest对象向服务器端发送请求的基本流程可以分为5步:
     1   从Web表单中获取需要的数据;
     2   建立要连接的URL;
     3   打开到服务器的连接;
     4   设置服务器在完成后要运行的函数;
     5   发送请求; 继续阅读…

DWR 的 util.addRows() 函数的使用

没有评论 2009年6月20日

util.addRows(id, array, cellfuncs, [options]);

描述:
向指定id的table元素添加行。它使用数组中的每一个元素(对象)在table中创建一行。然后用 cellfuncs 数组中的对应的函数创建一个列。单元格是依次用 cellfunc 根据没有数组中的元素创建出来的。

DWR1.1开始,addRows()也可以用对象(遍历对象的属性创建行)做为数据。如果你用一个对象代替一个数组来创建单元格,这个对象会被传递给cell函数。

参数(前三个函数 id, array, cellfuncs 是必须的):

id: table元素的id(最好是tbody元素的id)
array: 数组(DWR1.1以后可以是对象,这种用法会有代码说明),做为更新表格数据。
cellfuncs: 函数数组,从传递过来的行数据中提取单元格数据。每个函数对应于一列

options: 一个包含选项的对象(见下面)
选项包括:
rowCreator: 一个用来创建行的函数(例如,你希望个tr加个css). 默认是返回一个document.createElement(“tr”)
cellCreator: 一个用来创建单元格的函数(例如,用th代替td). 默认返回一个document.createElement(“td”)
escapeHtml: true 或 false,设定是忽略创建列时 cellfunc 函数中返回的 HTML 代码,默认为 true