2

私は Visual Studio 2008 を使用して ASP.NET サイトを構築しており、ページは次のようになっています (一部省略)。

<asp:Content ID="Content2" ContentPlaceHolderID="PageContentPlaceHolder" runat="server">
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            the page here..
        </ContentTemplate>
    </asp:UpdatePanel>
    <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="100">
        <ProgressTemplate>
            <div>
                <asp:Image ID="AjaxImage" runat="server" ImageUrl="Ajax.gif" />
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>
</asp:Content>

page_load は長い (>5 秒) プロセスを開始します

protected void Page_Load(object sender, EventArgs e)
{            
  if (!IsPostBack)            
  {
    LongRunningProcess();                
  }
}

LongRunningProcess の実行中に UpdateProgress を表示するにはどうすればよいですか? LongRunningProcess() 呼び出しをボタンの onclick ハンドラーに移動すると機能します。

4

6 に答える 6

3
  1. page_load コードを新しい関数に移動します。
  2. ページの ContentTemplate セクションに AJAX タイマーを追加します。間隔を 500 に設定します。 (1/2 秒)
  3. デザイン ビューで Timer オブジェクトをダブルクリックして、_tick ハンドラーを作成します。
  4. 前の手順で作成した _tick ハンドラーで、次のコードを呼び出します。

    protected void My_Timer_Tick(object sender, EventArgs e)
    {
        My_Timer_Name.Enabled = false;
        My_Page_Load_Function(); // Function created in step 1 above)
    }
    
    protected void My_Page_Load_Function()
    {
        System.Threading.Thread.Sleep(5000); // A delay to simulate doing something.
        lblMyLabel.Text = "Done!";  // Write output to page. 
    } 
    
于 2013-02-15T19:34:21.013 に答える
2

デフォルトで「処理中」と表示されるように、Ajax.gif を表示する通常の div を作成します。

JavaScript の pageLoad() 関数で、Ajax の PageMethods を使用してページにコールバックします。

   function pageLoad(sender, args) {
                PageMethods.getVersions(LoadVersionsCallback);
    }

.aspx.cs ファイルで呼び出すメソッドは静的である必要があり、パラメーターを受け取ることができ、次のようになります。

   [System.Web.Services.WebMethod]
    public static string getVersions()
    {
      StringBuilder sb = new StringBuilder();
       ... etc.
      return sb.ToString();

    }

メソッドを呼び出したときに指定した JavaScript 関数は、メソッドが完了すると実行されます。結果渡しとなります。この関数の最後で、Ajax.gif div を非表示にします。

   function LoadVersionsCallback(result) {
    // do something with the results - I load a dropdown list box.

   ...etc. 
    // here is where you hide your div holding the Ajax.gif  

   }

そして、あなたがしていることを1秒以内に実行することに取り組みます....

于 2009-07-16T21:46:23.643 に答える
1

上記の JBrooks のアイデアを使用しました (つまり、進行状況インジケーターを Iframe も含むパネルの一部として表示し、Iframe が最初に読み込まれる前でも表示されるようにします)、単純化しました: iframe をスタイルして、表示されたときにオンになるようにしますアニメーションGIFの上部。

Javascript または C# コード ビハインドは必要ありません。

関連する ASPX とそれに続く CSS を次に示します。使用する画像をカバーするには、スタイルの「トップ」設定でヌードルする必要があります.

            <asp:Panel ID="DetailPanel" runat="server" CssClass="submitBox detailPanel">
                <asp:Table ID="Table1" runat="server" Width="100%">
                    <asp:TableHeaderRow ID="TableHeaderRow10" runat="server">
                        <asp:TableCell ID="TableHeaderCell" runat="server"
                            Font-Bold="true" HorizontalAlign="Center">
                        Title Text
                        </asp:TableCell>
                    </asp:TableHeaderRow>
                    <asp:TableRow>
                        <asp:TableCell HorizontalAlign="Center">
                            <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/animated_progress.gif" />
                        </asp:TableCell>
                    </asp:TableRow>
                </asp:Table>
                <div class="iframeOverlay">
                    <iframe id="IframeDetail" runat="server" style="width: 100%; height: 100%;" />
                </div>
            </asp:Panel>

.iframeOverlay { z-index: 2; 位置: 相対; 上: -50px; }

于 2010-03-11T01:58:47.030 に答える
0

Jクエリで。

<script>
 $(document).ready(function() {
 $('#<%= UpdateProgress1.ClientID %>').show(); 
 });
</script>
于 2015-03-06T19:24:34.650 に答える