gridview - グリッドビューにデータが取り込まれている間に「読み込み中」の画像を表示する

Question

C# ページにテキスト フィールドがほとんどありません。ユーザーがこれらのフィールドに入力して送信ボタンをクリックすると、結果として Gridview が表示されます。

ここでの問題は、背後で実行されるクエリが大量のデータをスキャンするため、グリッドビューが完全に読み込まれるまでに長い時間がかかることです。

したがって、Gridview が読み込まれるまで、ユーザーがシステムがクラッシュしたと感じないように、読み込み中の画像を表示する必要がありました。 output.どうすればいいですか？助けてください！

   <form id="form1" runat="server">
     <div>
     <b>Enter value 1 :</b>
        <asp:TextBox id="p1" runat="server" /> <br />
     <b>Enter value2 :</b>
        <asp:TextBox id="p2" runat="server" /><br />
        <asp:Button ID="btn1" runat="server" OnClick="Button1_Click" Text="Start Search"/>
        <hr />

         <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:updatepanel id="ResultsUpdatePanel" runat="server">    
    <contenttemplate>

    <div style="text-align:center;">
    <asp:updateprogress id="UpdateProgress1" runat="server" associatedupdatepanelid="ResultsUpdatePanel" dynamiclayout="true">
                        <progresstemplate>

                           <img src="loader.gif">

                        </progresstemplate>
                    </asp:updateprogress>

                    </div>

         <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="true"
                    OnPageIndexChanging="gridView_PageIndexChanging"
                    CssClass="gridstyle" 
                    EnableViewState="false"
                    AllowPaging="true">
                    <AlternatingRowStyle CssClass="altrowstyle" />
                    <HeaderStyle CssClass="headerstyle" />
                    <RowStyle CssClass="rowstyle" />
                    <RowStyle Wrap="false" />
                    <HeaderStyle Wrap="false" />
                </asp:GridView>
    </contenttemplate>
</asp:updatepanel>
    </div>
    </form>