ASP.NET技巧:教你制做Web实时进度条_实用技巧

网上已经有很多Web进度条的例子,但是很多都是估算时间,不能正真反应任务的真实进度。我自己结合多线程和ShowModalDialog制做了一个实时进度条,原理很简单:使用线程开始长时间的任务,定义一个Session,当任务进行到不同的阶段改变Session的值,线程开始的同时使用ShowModalDialog打开一个进度条窗口,不断刷新这个窗口获取Session值,反应出实时的进度。下面就来看看具体的代码:(文章结尾处下载源代码)

先新建一个Default.aspx页面,
客户端代码:

<body MS_POSITIONING="GridLayout">
    <form id="Form1" method="post" runat="server">
            <br>
            <br>
            <asp:Button id="Button1" runat="server" Text="Start Long Task!"></asp:Button>
    </form>
</body>
服务器端代码:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Text;

namespace WebProgressBar
{
    /**//// <summary>
    /// Summary description for _Default.
    /// </summary>
    public class _Default : System.Web.UI.Page
    {
        protected System.Web.UI.WebControls.Button Button1;

        private void Page_Load(object sender, System.EventArgs e)
        {
            // Put user code to initialize the page here
        }

        Web Form Designer generated code#region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            //
            InitializeComponent();
            base.OnInit(e);
        }

        /**//// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {   
            this.Button1.Click += new System.EventHandler(this.Button1_Click);
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion

        private void LongTask()
        {
            //模拟长时间任务
            //每个循环模拟任务进行到不同的阶段
            for(int i=0;i<11;i++)
            {
                System.Threading.Thread.Sleep(1000);
                //设置每个阶段的state值,用来显示当前的进度
                Session["State"] = i+1;
            }
            //任务结束
            Session["State"] = 100;

        }

        public static void OpenProgressBar(System.Web.UI.Page Page)
        {
            StringBuilder sbScript = new StringBuilder();

            sbScript.Append("<script language='JavaScript' type='text/javascript'>\n");
            sbScript.Append("<!--\n");
            //需要IE5.5以上支持
            sbScript.Append("window.showModalDialog('Progress.aspx','','dialogHeight: 100px; dialogWidth: 350px; edge: Raised; center: Yes; help: No; resizable: No; status: No;scroll:No;');\n");
            //IE5.5以下使用window.open
            //sbScript.Append("window.open('Progress.aspx','', 'height=100, width=350, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no');\n");
            sbScript.Append("// -->\n");
            sbScript.Append("</script>\n");

            Page.RegisterClientScriptBlock("OpenProgressBar", sbScript.ToString());
        }

        private void Button1_Click(object sender, System.EventArgs e)
        {
            System.Threading.Thread thread=new System.Threading.Thread(new System.Threading.ThreadStart(LongTask));
            thread.Start();

            Session["State"]=1;
            OpenProgressBar(this.Page);
        }
    }
}

新建一个进度条页面Progress.aspx
客户端:
在head中加入<base target="_self">
<body MS_POSITIONING="GridLayout">
        <form id="Form1" method="post" runat="server">
            <asp:Label id="lblMessages" runat="server"></asp:Label>
            <asp:Panel id="panelBarSide" runat="server" Width="300px" BorderStyle="Solid" BorderWidth="1px"
                ForeColor="Silver">
                <asp:Panel id="panelProgress" runat="server" Width="10px" BackColor="Green"></asp:Panel>
            </asp:Panel>
            <asp:Label id="lblPercent" runat="server" ForeColor="Blue"></asp:Label>
        </form>
</body>
服务器端:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace WebProgressBar
{
    /**//// <summary>
    /// Summary description for Progress.
    /// </summary>
    public class Progress : System.Web.UI.Page
    {
        protected System.Web.UI.WebControls.Label lblMessages;
        protected System.Web.UI.WebControls.Panel panelProgress;
        protected System.Web.UI.WebControls.Panel panelBarSide;
        protected System.Web.UI.WebControls.Label lblPercent;

        private int state = 0;
        private void Page_Load(object sender, System.EventArgs e)
        {
            // Put user code to initialize the page here
            if(Session["State"]!=null)
            {
                state = Convert.ToInt32(Session["State"].ToString());
            }
            else
            {
                Session["State"]=0;
            }
            if(state>0&&state<=10)
            {
                this.lblMessages.Text = "Task undertaking!";
                this.panelProgress.Width = state*30;
                this.lblPercent.Text = state*10 + "%";
                Page.RegisterStartupScript("","<script>window.setTimeout('window.Form1.submit()',100);</script>");
            }
            if(state==100)
            {
                this.panelProgress.Visible = false;
                this.panelBarSide.Visible = false;
                this.lblMessages.Text = "Task Completed!";
                Page.RegisterStartupScript("","<script>window.close();</script>");
            }
        }

        Web Form Designer generated code#region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
            //
            // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            //
            InitializeComponent();
            base.OnInit(e);
        }

        /**//// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {   
            this.Load += new System.EventHandler(this.Page_Load);

        }
        #endregion
    }
}

 

时间: 2024-12-24 20:33:51

ASP.NET技巧:教你制做Web实时进度条_实用技巧的相关文章

ASP.NET技巧:教你制做Web实时进度条

asp.net|web|技巧 网上已经有很多Web进度条的例子,但是很多都是估算时间,不能正真反应任务的真实进度.我自己结合多线程和ShowModalDialog制做了一个实时进度条,原理很简单:使用线程开始长时间的任务,定义一个Session,当任务进行到不同的阶段改变Session的值,线程开始的同时使用ShowModalDialog打开一个进度条窗口,不断刷新这个窗口获取Session值,反应出实时的进度.下面就来看看具体的代码:(文章结尾处下载源代码) 先新建一个Default.aspx

仿vs实现WPF好看的进度条_实用技巧

为了界面友好,一般的操作时间较长时,都需要增加进度条提示.由于WPF自带的进度条其实不怎么好看,而且没啥视觉效果.后来,装VS2012时,发现安装过程中进度条效果不错,于是上网查了资料.学习了ModernUI(开源的),地址:https://github.com/firstfloorsoftware/mui. 后来,做了尝试写了个Demo,效果不错.另外,专门录制了tif文件,方便大家看到效果.废话不多说,先展示效果: 一.效果展示 A.VS2012安装界面图: B.个人尝试Demo效果图: 二

asp.net开发中怎样去突破文件依赖缓存_实用技巧

在Web项目中可以使用Session,Application等来缓存数据,也可以使用Cache来缓存. 今天我们特别关注的是Cache缓存.Cache位于命名空间System.Web.Caching命名空间下,看到这里我们想到的是它在Web项目中使用. 说明:Cache 类不能在 ASP.NET 应用程序外使用.它是为在 ASP.NET 中用于为 Web 应用程序提供缓存而设计和测试的.在其他类型的应用程序(如控制台应用程序或 Windows 窗体应用程序)中,ASP.NET 缓存可能无法正常工

asp.net下计算数字1至10的总和_实用技巧

复制代码 代码如下: protected void Page_Load(object sender, EventArgs e) { Response.Write(string.Format("数字1~10总和等于{0}.", Sum(1, 10).ToString())); } private int Sum(int min, int max) { int s = 0; for (int i = min; i <= max; i++) { s += i; } return s;

详解ASP.NET Core应用中如何记录和查看日志_实用技巧

日志记录不仅对于我们开发的应用,还是对于ASP.NET Core框架功能都是一项非常重要的功能特性.我们知道ASP.NET Core使用的是一个极具扩展性的日志系统,该系统由Logger.LoggerFactory和LoggerProvider这三个核心对象组成.我们可以通过简单的配置实现对LoggerFactory的定制,以及对LoggerProvider添加. 一. 配置LoggerFactory 我们在上面一节演示了一个展示ASP.NET Core默认注册服务的实例,细心的读者一定会看到显

asp.net微信开发(已关注用户管理)_实用技巧

公众号可通过本接口来获取帐号的关注者列表,关注者列表由一串OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的)组成.一次拉取调用最多拉取10000个关注者的OpenID,可以通过多次拉取的方式来满足需求. 接口调用请求说明 http请求方式: GET(请使用https协议) 返回说明 正确时返回JSON数据包: 错误时返回JSON数据包(示例为无效AppID错误): {"errcode":40013,"errmsg":"invalid

ASP.NET如何使用web服务的会话状态_实用技巧

在web服务中要用到ASP.NET中的会话对象,有2件事情需要做. 1.WebService 类需要继承System.Web.Services.WebService类 2.WebMethod中的EnableSession属性值应该设置为true 来看我们CalculatorWebService类,我们可以看到,它已经继承System.Web.Services.WebService类.但是,我们需要EnableSession属性值设置为true. 本文中,我们将试试在使用一个如下所示的GridVi

手把手教你在.NET中创建Web服务实现方法_实用技巧

最近发现在.NET平台下使用Web服务还是很简单的.下面举个在.NET平台下创建Web服务的简单例子.首先用Visul Studio .Net创建一个C# 项目Asp.Net Web服务程序,源代码如下: 复制代码 代码如下: using System;using System.Collections;using System.ComponentModel;using System.Data;using System.Diagnostics;using System.Web;using Syst

asp.net Web.config 详细配置说明_实用技巧

<?xml version="1.0" standalone="yes"?> <configuration xmlns="http://schemas.microsoft.com/.NetConfiguration/v2.0"> <!--配置全局变量--> <appSettings> <add key="examstr" value="server=.;datab