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

2024-09-27 00:13:27

网上已经有很多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");
            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>");
            }
        }

}
#endregion
}
}

asp.net文件上传带进度条实现案例（多种风格）

先饱饱眼福: 在之前的文章中也有类似带进度条文件传送的案例,大家可以翻阅之前的文章对知识点进行扩充. 部分代码: <%@ Page Language="C#" %> <%@ Register Assembly="MattBerseth.WebControls.AJAX" Namespace="MattBerseth.WebControls.AJAX.Progress" TagPrefix="mb" %>
asp.net web大文件上传带进度条实例代码

复制代码代码如下: using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using Syste
ASP.NET实现用图片进度条显示投票结果

一个投票功能模块少不了查看投票结果,用进度条显示各个投票结果可以起到一目了然的效果.以下是我的方法,请大家不吝赐教: 1:做一张图片用于做进度条,只需要很小的一个图片就可以了,如高20px,宽1px. 2:在要显示进度条的单元格中插入image控件,其imageUrl设置为已做好的图片的位置. 3:用一个dataReader对象dr保存取出的各项票数,用一个int 型变量sum保存取出的总票数,各项分别再定义一个double型变量用来保存单项票数除以(/)总票数的结果(小数),再定义一个int
asp.net 在客户端显示服务器端任务处理进度条的探讨

下面就是采用静态变量的方法实现的: 复制代码代码如下: <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1 -transitional.dtd"> <script runat="server"
asp.net单文件带进度条上传的解决方案

最近做项目中遇到很多问题,比如带进度条的文件上传,看了网上很多资料还没找到真正意义上的ASP.NET实现进度条上传(可能是我没找到),下面我来跟大家分享一下我实现的这个程序. 首先看下界面效果,当然你可以完全修改界面为你自己所用. 先解释一下这个程序,该程序采用了jquery框架,实现了小文件上传,不超过80Mb,可以在web.config文件中进行相应的配置,但是有个最大值,具体需要查看msdn.开发环境采用visual studio 2013 .net framework 4.5,运行的时候
asp.net mvc 实现文件上传带进度条的思路与方法

前言文件上传与下载的操作在实际项目中经常是很重要的一个内容,在使用ASP.NET Web Form的时候我们可以使用诸多的服务器控件,FileIpload就是其中之一,但是在ASP.NET不建议使用那些服务器控件,因为那样违反三层架构原则.最近参考网络资料,学习了ASP.NET MVC如何上传文件. 而这篇文章主要重点是asp.net mvc 实现文件上传带进度条,下面来一起看看吧. 实现思路 ajax异步上传文件,且开始上传文件的时候启动轮询来实时获取文件上传进度.保存进度我采用的是memc
asp.net 生成静态页时的进度条显示

asp.net如何生成静态页,请参考下面的文章:http://www.jb51.net/article/18175.htm而我们用模拟的话,只需要让线程延迟执行就可以了.比如下面的代码: 复制代码代码如下: for (int i = 0; i < 10; i++) { DateTime startTime = DateTime.Now; Response.Write(i + "-------------执行时间:" + startTime.ToString()+"&l
Asp.Net 无刷新文件上传并显示进度条的实现方法及思路

相信通过Asp.Net的服务器控件上传文件在简单不过了,通过AjaxToolkit控件实现上传进度也不是什么难事,为什么还要自己辛辛苦苦来实现呢?我并不否认"拿来主义",只是我个人更喜欢凡是求个所以然.本篇将阐述通过Html,IHttpHandler和 IHttpAsyncHandler实现文件上传和上传进度的原理,希望对你有多帮助. 效果图: 本文涉及到的知识点:1.前台用到Html,Ajax,JQuery,JQuery UI 2.后台用到一般处理程序(IHttpHandler)和
asp.net(c#)开发中的文件上传组件uploadify的使用方法（带进度条）

在Web开发中,有很多可以上传的组件模块,利用HTML的File控件的上传也是一种办法,不过这种方式,需要处理的细节比较多,而且只能支持单文件的操作.在目前Web开发中用的比较多的,可能uploadify(参考http://www.uploadify.com/)也算一个吧,不过这个版本一直在变化,他们的脚本调用也有很大的不同,甚至调用及参数都一直在变化,很早的时候,那个Flash的按钮文字还没法变化,本篇随笔主要根据项目实际,介绍一下3.1版本的uploadify的控件使用,这版本目前还是最新的
利用Asp.Net回调机制实现进度条

其效果如下:首先,在HTML文档中加入如下代码:<div> <table class="statusTable"> <tr> <td id="progress1"> </td> <td id="progress2"> </td> <td id="progress3"> </td> <td id="prog

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

相关推荐

随机推荐