您的位置:首页 > 产品设计 > UI/UE

Ajax.Request 类实现页面更新数据

2009-01-06 10:34 288 查看
这是一个用Ajax.Request类实现的在加载页面之后,异步更新页面数据的例子。我需要在
<span id="testReport">0</span>
里更新从数据库里读取的数据。

(A)//Ajax异步获得数据方法
var GetDataAjax = new Ajax.Request
(
'IndexHelp.aspx?SystemName=WaitReport',
{
method: 'get',
onComplete: showWaitResponse
}
);
function showWaitResponse(response)
{
var numArea=document.getElementById("testReport");
if(numArea!=null)
{
if(response.responseText=="")
{
numArea.innerHTML="0";
}
else
{
var tempstr=response.responseText.split("&&");
numArea.innerHTML=tempstr[0];
}
}
}
(B)//传送数据方法
在IndexHelp.aspx页面 Page_Load方法中写
……
switch (Request.QueryString["SystemName"])
{
case “WaitReport”:
Response.Write(99&&测试成功!);
break;
……
}
即可以把99插入到页面上实现页面数据更新。

参数 {method: ''get'', parameters: pars, onComplete: showResponse} 表示一个匿名对象的真实写法。
他表示你传入的这个对象有一个名为 method 值为 ''get'' 的属性,另一个属性名为 parameters 包含 HTTP 请求的查询字符串,和一个 onComplete 属性/方法包含函数 showResponse。
如果没有查询要求,parameters: pars 一般不用也可以,我就经常不用咯。
比如参数可以写成:
var kid = $F(''lstEmployees'');
var y = $F(''lstYears'');
var pars = ''KID='' + kid + ''&YEAR='' + year;
根据自己的需要自己写吧。

还有一些其它的属性可以在这个对象里面定义和设置,如 asynchronous,可以为true 或 false 来决定AJAX对服务器的调用是否是异步的(默认值是 true)。

在我们的例子中,在第一个参数通过HTTP GET命令请求那个url,传入了变量 pars包含的查询字符串, Ajax.Request 对象在它完成接收响应的时候将调用showResponse 方法。

还有另外两个有用的选项用来处理结果。我们可以在onSuccess 选项处传入一个方法,当AJAX无误的执行完后调用, 相反的,也可以在onFailure选项处传入一个方法,当服务器端出现错误时调用。正如onXXXXX 选项传入的方法一样,这两个在被调用的时候也传入一个带有AJAX请求的XMLHttpRequest对象。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: