asp.net UpdaeProgress的簡(jiǎn)單用法
更新時(shí)間:2008年10月29日 22:18:01 作者:
這個(gè)控件相比其他控件,屬性少 使用簡(jiǎn)單,就先把這個(gè)控件的一般使用方法簡(jiǎn)單紀(jì)錄下
UpdateProgress 應(yīng)該就是“更新進(jìn)度” 的意思吧。
使用方法:
1.添加一個(gè)ScriptManager控件
2.添加一個(gè)UpdatePanel控件
3.添加一個(gè)UpdateProgress控件
設(shè)置UpdateProgress控件的AssociatedUpdatePanelID為第2步 UpdatePanel的ID(如果頁(yè)面中有多個(gè)UpdatePanel則,只有相應(yīng)updatePanel關(guān)聯(lián)的updateProgress顯示)
測(cè)試?yán)哟a:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<style type="text/css">
#UpdatePanel1, #UpdatePanel2, #UpdateProgress1 {
border-right: gray 1px solid; border-top: gray 1px solid;
border-left: gray 1px solid; border-bottom: gray 1px solid;
}
#UpdatePanel1, #UpdatePanel2 {
width:200px; height:200px; position: relative;
float: left; margin-left: 10px; margin-top: 10px;
}
#UpdateProgress3 {
width: 200px; background-color: #FFC080;
bottom: 0%; left: 0px; position: absolute;
}
#UpdateProgress2 {
width: 200px; background-color: #FFC080;
bottom: 0%; left: 0px; position: absolute;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click1" Text="Button" />
<asp:Label ID="Label1" runat="server" Text="顯示數(shù)據(jù)"></asp:Label>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div id="progress"><img src="img/1.gif" />
等待中...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click1" Text="Button" /><br />
<br />
<asp:Label ID="Label2" runat="server" Text="顯示數(shù)據(jù)"></asp:Label>
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
更新數(shù)據(jù)中....
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
c#代碼:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Threading;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click1(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label1.Text = "刷新時(shí)間:" + DateTime.Now.ToString();
}
protected void Button2_Click1(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label2.Text = "刷新時(shí)間:" + DateTime.Now.ToString();
}
}
其中,頁(yè)面代碼中的css是msdn上的例子。UpdatePanel1中的UpdateProgress1顯示一張動(dòng)態(tài)gif圖片
還往大哥大姐們多多指教。
使用方法:
1.添加一個(gè)ScriptManager控件
2.添加一個(gè)UpdatePanel控件
3.添加一個(gè)UpdateProgress控件
設(shè)置UpdateProgress控件的AssociatedUpdatePanelID為第2步 UpdatePanel的ID(如果頁(yè)面中有多個(gè)UpdatePanel則,只有相應(yīng)updatePanel關(guān)聯(lián)的updateProgress顯示)
測(cè)試?yán)哟a:
復(fù)制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<style type="text/css">
#UpdatePanel1, #UpdatePanel2, #UpdateProgress1 {
border-right: gray 1px solid; border-top: gray 1px solid;
border-left: gray 1px solid; border-bottom: gray 1px solid;
}
#UpdatePanel1, #UpdatePanel2 {
width:200px; height:200px; position: relative;
float: left; margin-left: 10px; margin-top: 10px;
}
#UpdateProgress3 {
width: 200px; background-color: #FFC080;
bottom: 0%; left: 0px; position: absolute;
}
#UpdateProgress2 {
width: 200px; background-color: #FFC080;
bottom: 0%; left: 0px; position: absolute;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click1" Text="Button" />
<asp:Label ID="Label1" runat="server" Text="顯示數(shù)據(jù)"></asp:Label>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div id="progress"><img src="img/1.gif" />
等待中...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click1" Text="Button" /><br />
<br />
<asp:Label ID="Label2" runat="server" Text="顯示數(shù)據(jù)"></asp:Label>
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
更新數(shù)據(jù)中....
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
c#代碼:
復(fù)制代碼 代碼如下:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Threading;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Button1_Click1(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label1.Text = "刷新時(shí)間:" + DateTime.Now.ToString();
}
protected void Button2_Click1(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);
Label2.Text = "刷新時(shí)間:" + DateTime.Now.ToString();
}
}
其中,頁(yè)面代碼中的css是msdn上的例子。UpdatePanel1中的UpdateProgress1顯示一張動(dòng)態(tài)gif圖片
還往大哥大姐們多多指教。
相關(guān)文章
ASP.NET?Core托管模型CreateDefaultBuilder()方法
這篇文章介紹了ASP.NET?Core托管模型CreateDefaultBuilder()方法,對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-02-02ASP.NET?Core命名空間System.Text.Encodings.Web介紹
這篇文章介紹了ASP.NET?Core命名空間System.Text.Encodings.Web,對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-01-01.Net行為型設(shè)計(jì)模式之職責(zé)鏈模式(Chain of Responsibility)
這篇文章介紹了.Net行為型設(shè)計(jì)模式之職責(zé)鏈模式(Chain of Responsibility),文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-05-05通過(guò)VS中的數(shù)據(jù)源選擇對(duì)話(huà)框簡(jiǎn)單實(shí)現(xiàn)數(shù)據(jù)庫(kù)連接配置
通過(guò)VS中的數(shù)據(jù)源選擇對(duì)話(huà)框簡(jiǎn)單實(shí)現(xiàn)數(shù)據(jù)庫(kù)連接配置...2007-02-02創(chuàng)建ASP.NET?Core?Web應(yīng)用程序并介紹項(xiàng)目模板
這篇文章介紹了創(chuàng)建ASP.NET?Core?Web應(yīng)用程序的方法,對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-02-02