ASP.NET技巧:教你制做Web實(shí)時(shí)進(jìn)度條
網(wǎng)上已經(jīng)有很多Web進(jìn)度條的例子,但是很多都是估算時(shí)間,不能正真反應(yīng)任務(wù)的真實(shí)進(jìn)度。我自己結(jié)合多線程和ShowModalDialog制做了一個(gè)實(shí)時(shí)進(jìn)度條,原理很簡(jiǎn)單:使用線程開(kāi)始長(zhǎng)時(shí)間的任務(wù),定義一個(gè)Session,當(dāng)任務(wù)進(jìn)行到不同的階段改變Session的值,線程開(kāi)始的同時(shí)使用ShowModalDialog打開(kāi)一個(gè)進(jìn)度條窗口,不斷刷新這個(gè)窗口獲取Session值,反應(yīng)出實(shí)時(shí)的進(jìn)度。下面就來(lái)看看具體的代碼:(文章結(jié)尾處下載源代碼)
先新建一個(gè)Default.aspx頁(yè)面,
客戶端代碼:
<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>
服務(wù)器端代碼:
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()
{
//模擬長(zhǎng)時(shí)間任務(wù)
//每個(gè)循環(huán)模擬任務(wù)進(jìn)行到不同的階段
for(int i=0;i<11;i++)
{
System.Threading.Thread.Sleep(1000);
//設(shè)置每個(gè)階段的state值,用來(lái)顯示當(dāng)前的進(jìn)度
Session["State"] = i+1;
}
//任務(wù)結(jié)束
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("http:// -->\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);
}
}
}
新建一個(gè)進(jìn)度條頁(yè)面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>
服務(wù)器端:
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
}
}
- Asp.net基于ajax和jquery-ui實(shí)現(xiàn)進(jìn)度條
- ASP.NET實(shí)現(xiàn)進(jìn)度條效果
- asp.net mvc 實(shí)現(xiàn)文件上傳帶進(jìn)度條的思路與方法
- asp.net文件上傳帶進(jìn)度條實(shí)現(xiàn)案例(多種風(fēng)格)
- asp.net單文件帶進(jìn)度條上傳的解決方案
- Asp.Net 無(wú)刷新文件上傳并顯示進(jìn)度條的實(shí)現(xiàn)方法及思路
- asp.net 生成靜態(tài)頁(yè)時(shí)的進(jìn)度條顯示
- 利用Asp.Net回調(diào)機(jī)制實(shí)現(xiàn)進(jìn)度條
- ASP.NET?MVC使用jQuery?ui的progressbar實(shí)現(xiàn)進(jìn)度條
相關(guān)文章
Asp.net MVC中使用JQuery插件ajaxFileUpload上傳文件
這篇文章主要介紹了Asp.net MVC中使用JQuery插件ajaxFileUpload上傳文件,需要的朋友可以參考下2016-08-08使用.NET存儲(chǔ)XML數(shù)據(jù)的方法
使用.NET存儲(chǔ)XML數(shù)據(jù)的方法...2007-04-04Asp.Net?Core?使用Monaco?Editor?實(shí)現(xiàn)代碼編輯器功能
在項(xiàng)目中經(jīng)常有代碼在線編輯的需求,比如修改基于Xml的配置文件,編輯Json格式的測(cè)試數(shù)據(jù)等。這篇文章主要介紹了Asp.Net?Core?使用Monaco?Editor?實(shí)現(xiàn)代碼編輯器功能,需要的朋友可以參考下2022-01-01.net core 6.0 通過(guò)依賴注入注冊(cè)和使用上下文服務(wù)的教程
在.NET Core 6.0 中,獲取上下文的方式取決于您使用的技術(shù)棧和具體的應(yīng)用程序類(lèi)型,這篇文章主要介紹了.net core 6.0 通過(guò)依賴注入注冊(cè)和使用上下文服務(wù)的教程,需要的朋友可以參考下2023-12-12.net 中的 StringBuilder 和 TextWriter 區(qū)別詳解
這篇文章主要介紹了.net 中的 StringBuilder 和 TextWriter 區(qū)別詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-09-09asp.net?core?中優(yōu)雅的進(jìn)行響應(yīng)包裝的實(shí)現(xiàn)方法
本文介紹了 Asp.Net Core 中的通用響應(yīng)包裝的實(shí)現(xiàn),以及如何讓 Swagger 識(shí)別響應(yīng)包裝,由于異常處理難以做到通用和一致,本文不處理異常情況下的響應(yīng)包裝,讀者可以自定義實(shí)現(xiàn) ExceptionFilter2022-01-01