UpdateProgress是一個進度顯示條,加在AJAX裡能顯得更加的人性化(個人認為)。現在我們就開始吧:
第一.建立一個AJAX項目。在頁面上加上ScriptManager,UpdatePanel,UpdateProgress,同時在UpdatePanel中加入一個Label,和Button。
第二:選中UpdateProgress的AssociatedUpdatePanelID設定為UpdatePanel1,完整的HTML代碼如下:<%@ Register
Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit"
TagPrefix="ajaxToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>無標題頁</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label" Width="166px"></asp:Label>
<br />
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="testUp" runat=server AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
progressing..
</ProgressTemplate>
</asp:UpdateProgress>
</form>
</body>
</html>
第三,在BUTTON中加入點擊事件,代碼如下: System.Threading.Thread.Sleep(5000);
Label1.Text = DateTime.Now.ToString();
主要是故意建立一個延遲,顯示效果。
最後,運行就ok了