加载图像不显示

Question

<asp:UpdatePanel ID="UpdtBank" runat="server">
 <ContentTemplate>
 <div style="text-align:center;">
    <asp:UpdateProgress AssociatedUpdatePanelID="UpdtBank" id="updateProgress" DynamicLayout="true" runat="server">
        <ProgressTemplate>
            <div style="position: fixed; text-align: center; height: 100%; width: 100%; top: 0; right: 0; left: 0; z-index: 9999999; background-color: #000000; opacity: 0.7;">
                <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/img/ajax-loader.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:45%;left:50%;" />
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>
    //My Code is Here
</div>

I have copy above code from the tutorial and Whosebug answers, but image is not showing at all. Kindly help me i cant find my mistake

Answer 1

尝试缩短显示 ProgressTemplate 的时间。默认情况下，这是 5 秒。此行为由属性控制：DisplayAfter

指定在显示进度控件之前经过的毫秒数，如果您希望等待 2 秒，则为 2000

<asp:UpdateProgress DisplayAfter="2000" AssociatedUpdatePanelID="UpdtBank"
     id="updateProgress" DynamicLayout="true" runat="server" />

Answer 2

将您的 asp:UpdateProgress 放在 asp:UpdatePanel 的外面 - 如下所示。

<asp:UpdatePanel ID="UpdtBank" runat="server">
 <ContentTemplate>
    <div style="text-align:center;">

    //My Code is Here
    </div>
  </ContentTemplate>
</asp:UpdatePanel >

 <asp:UpdateProgress AssociatedUpdatePanelID="UpdtBank" id="updateProgress" DynamicLayout="true" runat="server">
        <ProgressTemplate>
            <div style="position: fixed; text-align: center; height: 100%; width: 100%; top: 0; right: 0; left: 0; z-index: 9999999; background-color: #000000; opacity: 0.7;">
                <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/img/ajax-loader.gif" AlternateText="Loading ..." ToolTip="Loading ..." style="padding: 10px;position:fixed;top:45%;left:50%;" />
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>

加载图像不显示

Loading Image is not showing

javascript

c#

asp.net

loading

busy-cursor