





















用过ajax.net框架里的updatePanel的用户肯定会知道updateprogress的作用,专门用来在执行异步操作显示等待信息,用法非常简单,往里面放一些图片或文字即可实现看起来很不错的效果。但是这种方式是在页面运行之前就已经设置好了,不管什么操作都显示同一张图片或者文字,不能针对某个具体的按钮或者发送对象来显示信息,比如针对保存操作就显示"保存中...",提交操作就显示"提交中...",也就是能通过编程方式稍微灵活控制一下。也许有人说可以多设置几个updatepanel,给每个updatepanel分配一个updateProgress,这也是种方法,但是生成的标记未免多了点。
最近看了一下AJAX.NET的客户端脚本文档,知道通过框架提供的脚本能够更加细微的控制要显示的内容,并且还可以加上"取消"按钮或连接,点击取消可停止asyncPostback。通过脚本实现需要自己定制个类似updateProgress的div或者span,另外还要添加页面事件,控制提示信息的可见性。主要用到的是客户端脚本里的页面事件,具体简单实现如下:
![]()
1
<script language="javascript" type="text/javascript">
2
function pageLoad()
3
{
4
// 添加事件
5
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(onBeginRequest);
6
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(onEndRequest);
7
}
8
9
function onBeginRequest(sender, e)
10
{
11
var elem = e.get_postBackElement();
12
var requestManager = Sys.WebForms.PageRequestManager.getInstance();
13
14
// 点击取消则停止
15
if (requestManager.get_isInAsyncPostBack() & elem.id == "btnCancel" )
16
{
17
requestManager.abortPostBack();
18
}
19
20
// 显示正在处理的信息
21
if (elem.id != "btnCancel")
22
{
23
dispUpdateProgress(String.format("{0} oper is processing
.", elem.value), "");
24
}
25
}
26
27
function onEndRequest(sender, e)
28
{
29
dispUpdateProgress("", "none");
30
}
31
32
// 控制显示提示信息
33
function dispUpdateProgress(msg, display)
34
{
35
$get("updateProgress").style.display = display;
36
$get("processingMsg").innerHTML = msg;
37
}
38
</script>
39
<form id="form1" runat="server">
40
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"/>
41
<asp:UpdatePanel ID="up" runat="server">
42
<ContentTemplate>
43
<asp:Button ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click" />
44
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSave_Click" />
45
<div id="updateProgress" style="display:none">
46
<span id="processingMsg"></span>
47
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
48
</div>
49
</ContentTemplate>
50
</asp:UpdatePanel>
51
</form>
![]()
1
protected void btnSave_Click(object sender, EventArgs e)
2
{
3
Thread.Sleep(4000);
4
}
此内容由惯性聚合(RSS阅读器)自动聚合整理,仅供阅读参考。 原文来自 — 版权归原作者所有。