ASP.NET服务器控件PleaseWaitButton

作者佚名技术来源 NET编程浏览发布时间 2012-05-21

Introduction

在web application的表单提交过程中显示“please wait”信息或者是gif动画图片通常是很有用的，特别是提交过程比较久的情况。我最近开发了一个调查提交程序，在程序里内部用户通过一个网页上传excel电子表格。程序将上传的电子表格数据插入到数据库中。这个过程只需要几秒钟，但即便是几秒钟，在网页是看来却是非常明显的等待过程。在程序测试的时候，一些用户重复地点击上传按钮。因此，提供一个视觉的信息来告诉人们上传正在进行中是很有用的。并同时把上传按钮一起隐藏掉，以防止多次点击。这里介绍的控件是Button控件的子类，它演示了如何把客户端javascript代码封装在asp.net服务器控件中来提供便利的功能。

虽然外面已经有很多javascript的例子来完成这件事情，但当我试图把这些功能封装到asp.net控件中时我发现了一些问题。我最开始尝试通过javascript的onclick句柄来使button无效，并用另外的文本取代。但我发现很棘手，这样会妨碍到asp.net服务器端的click事件的功能。而最终行得通的，并且对不同浏览器也有很好支持的方法是，让button在div标记中呈现。div可以隐藏并且不妨碍asp.net的click事件。

Using the control

作为正常的button控件的派生，PleaseWaitButton的功能与它基本一样。它通过三个附加的属性来管理当按钮被点击后"please Wait"信息或图片的显示。

PleaseWaitText

这是显示的客户端文本信息，如果存在，当按钮被点击它将取代按钮。

PleaseWaitImage

这是显示的图像文件（比如gif动画图像），如果存在，当按钮被点击它将取代按钮。这个属性将变成<img>标记中的src属性。

PleaseWaitType

PleaseWaitTypeEnum枚举值之一：TextOnly,ImageOnly,TextThenImage,或者ImageThenText。它控制消息和图片的布局。

下面是一个.aspx文件示例，它演示了一个设置了PleaseWaitText和PleaseWaitImage的PleastWaitButton。

<%@ Page language="C#" %> <%@ Register TagPrefix="cc1" Namespace="JavaScriptControls" 　　　　　　　　　　　　　　 Assembly="PleaseWaitButton" %> <script runat="server"> 　　 private void PleaseWaitButton1_Click(object sender, System.EventArgs e) 　　 { 　　　 // Server-side Click event handler; 　　　 // simulate something that could take a long time, 　　　 // like a file upload or time-consuming server processing 　　　 DateTime dt = DateTime.Now.AddSeconds(5); 　　　 while (DateTime.Now < dt) 　　　 { 　　　　 // do nothing; simulate a 5-second pause 　　　 } 　　　 // at the end of the loop display a success message 　　　 // and hide the submit form 　　　 panelSuccess.Visible = true; 　　　 PleaseWaitButton1.Visible = false; 　　 } </script> <html> 　　 <head> 　　　　 <title>Testing PleaseWaitButton</title> 　　 </head> 　　 <body> 　　　　 <form id="Form1" method="post" runat="server"> 　　　　　　 <P>Testing the PleaseWaitButton control.</p> 　　　　　　 <cc1:PleaseWaitButton id="PleaseWaitButton1" runat="server" 　　　　　　　　　　 Text="Click me to start a time-consuming process" 　　　　　　　　　　 PleaseWaitText="Please Wait " 　　　　　　　　　　 PleaseWaitImage="pleaseWait.gif" 　　　　　　　　　

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

1 2 3 4 5 下一页

分享到：更多

你可能对下面的文章感兴趣

上一篇: Asp.net MVC 1.0 RTM中实现文件上传下一篇: ASP.NET学习的九大步骤详解

关于ASP.NET服务器控件PleaseWaitButton的所有评论

随机推荐