快速业务通道

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 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号