VS 2008
本文介绍在异步提交过程中发挥着重大作用的客户端 PageRequestManager对象。
1. PageRequestManager 客户端事件模型
PageRequestManager是一个客户端的javascript对象,当发生异步postback请求时,伴随之一系列的事件发生
有了这个事件模型,在客户端,我们便可以跟踪异步postback过程,可以做一些特别的处理等。
2. 跟踪异步处理过程
页面中放置了ScriptManager控件,和一个UpdatePanel控件,然后放了一个divProgress,用于显示一些提示信息
<
asp:ScriptManager ID
=
"
ScriptManager1
"
runat
=
"
server
"
>
</
asp:ScriptManager
>
<
div
>
<
asp:UpdatePanel ID
=
"
uPanel1
"
runat
=
"
server
"
UpdateMode
=
"
Conditional
"
>
<
ContentTemplate
>
<
asp:TextBox ID
=
"
txtUserName
"
runat
=
"
server
"
/>
<
asp:Button ID
=
"
btnShowName
"
runat
=
"
server
"
Text
=
"
show name
"
onclick
=
"
btnShowName_Click
"
/>
</
ContentTemplate
>
</
asp:UpdatePanel
>
<
div id
=
"
divProgress
"
></
div
>
</
div
>
btnShowName的Click处理方法,用Thread.Sleep模拟提交结果返回的延时
protected
void
btnShowName_Click(
object
sender, EventArgs e)
{
System.Threading.Thread.Sleep(2000);
txtUserName.Text = "guozhijian";
}
现在看javascript:
<
script type
=
"
text/javascript
"
>
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
function pageLoad()
{
var req = Sys.WebForms.PageRequestManager.getInstance();
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
req.add_beginRequest(function(sender, eventArgs)
{
$get('divProgress').innerHTML = "loading
";
});
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
req.add_endRequest(function(sender, eventArgs)
{
$get('divProgress').innerHTML = "";
});
}
</
script
>
当点击btnShowName开始异步请求时,beginRequest事件发生,divProgress显示:"loading..."。
然后endRequest事件发生,divProgress显示信息被clear了,文本框显示"guozhijian"。
3. 中断异步回刷请求
在UpdatePanel中添加一个btnCancel控件:
<
div
>
<
asp:UpdatePanel ID
=
"
uPanel1
"
runat
=
"
server
"
UpdateMode
=
"
Conditional
"
>
<
ContentTemplate
>
<
asp:TextBox ID
=
"
txtUserName
"
runat
=
"
server
"
/>
<
asp:Button ID
=
"
btnShowName
"
runat
=
"
server
"
Text
=
"
show name
"
onclick
=
"
btnShowName_Click
"
/>
<
asp:Button ID
=
"
btnCancel
"
runat
=
"
server
"
Text
=
"
cancel
"
/>
</
ContentTemplate
>
</
asp:UpdatePanel
>
<
div id
=
"
divProgress
"
></
div
>
</
div
>
(suddenly I can't input chinese -.-! so i have no choice but use english in substitution for chinese)
then, i am going to modify the javascript, I call the argument's get_postBackElement() function and get the id property's value, if the value equals 'btnCancel', then I know that the btnCancel button was just clicked, so I call the req's abortPostBack() function.
note that although the partial page rendering request has been aborted, the endRequest event still gonna happen!
<
script type
=
"
text/javascript
"
>
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
function pageLoad()
{
var req = Sys.WebForms.PageRequestManager.getInstance();
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
req.add_beginRequest(function(sender, args)
{
$get('divProgress').innerHTML = "loading
";
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
if(args.get_postBackElement().id == 'btnCancel')
{
req.abortPostBack();
}
});
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
req.add_endRequest(function(sender, args)
{
$get('divProgress').innerHTML = "";
});
}
</
script
>
4. 异常处理
Also, we can use PageRequestManager for handling exception.
Let the btnShowName_Click method throw an exception:
protected
void
btnShowName_Click(
object
sender, EventArgs e)
{
throw new Exception("an error occured");
txtUserName.Text = "guozhijian";
}
Regardless of whether an error occurs during an asynchronous postback, the PageRequestManager raises the endRequest event, so we write error handling code like this:
req.add_endRequest(function(sender, args)
{
$get('divProgress').innerHTML = args.get_error().message;
args.set_errorHandled(true);
}
);
本文介绍在异步提交过程中发挥着重大作用的客户端 PageRequestManager对象。
1. PageRequestManager 客户端事件模型
PageRequestManager是一个客户端的javascript对象,当发生异步postback请求时,伴随之一系列的事件发生
![](https://i-blog.csdnimg.cn/blog_migrate/02c59a9bb42d2e5066b41b6dc072f799.gif)
有了这个事件模型,在客户端,我们便可以跟踪异步postback过程,可以做一些特别的处理等。
2. 跟踪异步处理过程
页面中放置了ScriptManager控件,和一个UpdatePanel控件,然后放了一个divProgress,用于显示一些提示信息
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
btnShowName的Click处理方法,用Thread.Sleep模拟提交结果返回的延时
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4fd96b3cf02f4c7b5c8964ac8167f7af.gif)
现在看javascript:
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f2671b7f42ce505d9bf55a7a0ca257fb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/eec4c0236afc26744c9c4e910bc34958.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f2671b7f42ce505d9bf55a7a0ca257fb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/eec4c0236afc26744c9c4e910bc34958.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4fd96b3cf02f4c7b5c8964ac8167f7af.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
当点击btnShowName开始异步请求时,beginRequest事件发生,divProgress显示:"loading..."。
然后endRequest事件发生,divProgress显示信息被clear了,文本框显示"guozhijian"。
3. 中断异步回刷请求
在UpdatePanel中添加一个btnCancel控件:
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
(suddenly I can't input chinese -.-! so i have no choice but use english in substitution for chinese)
then, i am going to modify the javascript, I call the argument's get_postBackElement() function and get the id property's value, if the value equals 'btnCancel', then I know that the btnCancel button was just clicked, so I call the req's abortPostBack() function.
note that although the partial page rendering request has been aborted, the endRequest event still gonna happen!
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f2671b7f42ce505d9bf55a7a0ca257fb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f2671b7f42ce505d9bf55a7a0ca257fb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/eec4c0236afc26744c9c4e910bc34958.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/eec4c0236afc26744c9c4e910bc34958.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/3112b7b6526db5bc83e275260ae60525.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f2671b7f42ce505d9bf55a7a0ca257fb.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/eec4c0236afc26744c9c4e910bc34958.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4fd96b3cf02f4c7b5c8964ac8167f7af.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/f0cd6c7f9e7ae96feae062cb48f670f0.gif)
4. 异常处理
Also, we can use PageRequestManager for handling exception.
Let the btnShowName_Click method throw an exception:
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4fd96b3cf02f4c7b5c8964ac8167f7af.gif)
Regardless of whether an error occurs during an asynchronous postback, the PageRequestManager raises the endRequest event, so we write error handling code like this:
![](https://i-blog.csdnimg.cn/blog_migrate/34031c708bfe702fe82d01ff5c6593aa.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0be121fa5b8988fbabbbc526af3b0fc0.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/b854634c0904529d4018c4c3336be836.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/587e34b10dcf5efbc0859b53470a2db3.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/4fd96b3cf02f4c7b5c8964ac8167f7af.gif)
don't forget to write the line : args.set_errorHandled(true), or an window alert box will show unexpectedly.
之前1-12都是摘自:http://www.cnblogs.com/guozhijian
对作者表示感谢!
纠正一个错误
req.add_endRequest
这些添加事件处理函数的代码不能放在pageLoad里面,因为每次异步提交都会跑一次pageLoad,这样就无休止的加上去了,
必须放在Sys.Application的init事件处理里面