閲覧総計:12581 (本日:1 昨日:0)
Ajaxでは、ページ遷移が発生しない為、プログラムが動いているのか?どうか?がわからない。
プログラムが「実行中」であることを明示する機能としてUpdateProgressが用意されている。
UpdateProgressの使用法を確認した。 10/08/12
教材にはビデオ動画でASP.NET Ajaxをわかり易く丁寧に解説してくれている
http://msdn.microsoft.com/ja-jp/events/dd297548.aspx?ppud=4
↑こちらのページ(全14回)を使用する事にした。
今回は、第3回「UpdateProgressを使ってみよう」の解説にしたがい作業をトレースしてみた。
http://www.microsoft.com/japan/seminar/msdn/webcast/bg/47.ajax.updateprogress/play.aspx
【参考】loading.gif画像は↓こちらの素材集から選んだ
http://www.benricho.org/loading_images/popular01.html
開発環境:VWD2008 + Access2003
サーバ:ASP.NET3.5 + Access2003
【デザイン画面↓】
【実行画面↓】
【実行サンプル↓】
http://www.kuri6005.useiis7.net/AjaxTr/UpdateProgress2/UpdateProgress.aspx
【UpdateProgress.aspx】
<%@ Page Language="VB" %> <%@ Register src="../HistoryCounter.ascx" tagname="HistoryCounter" tagprefix="uc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) System.Threading.Thread.Sleep(3000) Label1.Text = DateTime.Now.ToString() End Sub </script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> Ajaxの「実行中」を明示するUpdateProgressの使用法 10/08/11<br /> <br /> <fieldset> <legend> UpdatePnel窓(この窓内のみの情報が更新されます)</legend> <div> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <br /> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <br /> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" /> <br /> </ContentTemplate> </asp:UpdatePanel> </div> </fieldset> <br /> <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="100"> <ProgressTemplate> <img src="../loading-05.gif" style="width: 32px; height: 32px" />しばらくお待ちください </ProgressTemplate> </asp:UpdateProgress> </div> </form> </body> </html>
【参考にしたページ】
1.「UpdateProgressを使ってみよう」 07/06/01
http://www.microsoft.com/japan/seminar/msdn/webcast/bg/47.ajax.updateprogress/play.aspx