时间戳

首页 > 解决方案 > AJAX UpdateProgress 不显示

asp.net - AJAX UpdateProgress 不显示

问题描述

我有一个更新面板，其中包括一个带有两个按钮和一个模式弹出窗口的 gridview。当用户单击 btnView 时，会出现显示相关信息的模式弹出窗口。

我的问题是我一直试图让 updateprogress 在部分回发期间出现，但到目前为止还没有管理它。我应该提到的是，相同的 UpdateProgress 代码确实可以在测试页面中工作，该页面仅包含一个按钮，后面的代码中有一个具有睡眠功能的按钮。这是html：

<!-- Placing the GridView in UpdatePanel-->
  <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="gv" />
        </Triggers>
        <ContentTemplate>
            <asp:GridView ID="gv" runat="server" AutoGenerateColumns="False" DataKeyNames="GroupID" GridLines="Both"
                 BorderWidth="1px" CellPadding="2" ForeColor="Black" OnRowDataBound="gv_RowDataBound" BorderStyle="Double" HorizontalAlign="Center" 
                HeaderStyle-HorizontalAlign="Center" AllowSorting="True" CssClass="gvformat">
                <AlternatingRowStyle BackColor="#95B9B9" /> 
                <HeaderStyle BorderStyle="Double"  BorderColor="Black"/>
                <Columns>

                 <asp:BoundField DataField="FinancialYear" HeaderText="Financial Year"  ItemStyle-HorizontalAlign="Center"/>
                 <asp:TemplateField ItemStyle-HorizontalAlign="Center">
                    <ItemTemplate>
                        <asp:Button ID="btnView" runat="server" Text="view" OnClick="btnComments_Click" CausesValidation="false" Font-Names="Trebuchet MS" CssClass="btn btn-info" Font-Bold="True" />&nbsp;
                    </ItemTemplate>
                    <HeaderTemplate>Comment</HeaderTemplate> 
                 </asp:TemplateField>
                 <asp:TemplateField ItemStyle-HorizontalAlign="Center" ItemStyle-VerticalAlign="Middle">
                    <ItemTemplate>
                        <asp:Button ID="btnDetail" runat="server" Text="view" OnClick="btnDetails_Click" CausesValidation="false" Font-Names="Trebuchet MS" CssClass="btn btn-comment" ForeColor="White" Font-Bold="True" />
                    </ItemTemplate>
                    <HeaderTemplate>Details</HeaderTemplate> 
                 </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <asp:Button ID="bttnHidden" runat="Server" Style="display: none" />
            <br />

            <asp:Panel ID="pnlComment" runat="server" Width="650px" Height="620px"  Style="display: none;" CssClass="modalBox">
                <table border="1" class="commentTable" style="border-collapse: separate; border-spacing: 10px; width:100%; height:100%">
                    <tr><th><asp:Label ID="lblComments" runat="server" Text="Comments" Font-Size="Medium"></asp:Label></th></tr>
                    <tr><td>
                        <asp:TextBox ID="txtExistingComments" runat="server" TextMode="MultiLine" ReadOnly="True" CssClass="content" Rows="12" Font-Names="Trebuchet MS"></asp:TextBox>
                    </td></tr>
                    <tr><th><asp:Label ID="lblNewComment" runat="server" Text="Add Comment" Font-Size="Medium"></asp:Label></th></tr>
                    <tr><td>
                        <asp:TextBox ID="txtNewComments" runat="server" TextMode="MultiLine" ReadOnly="False" CssClass="content" Rows="12" Font-Names="Trebuchet MS"></asp:TextBox></td></tr>
                    <tr><td>
                            <asp:Button ID="btnSave" runat="server" width="100px" Text="Save" OnClick="btnSave_Click" CssClass="btn btn-comment" ValidationGroup="SaveComment" ForeColor="White" Font-Bold="True" />&nbsp;&nbsp;
                            <asp:Button ID="btnCancel" runat="server" width="100px" Text="Cancel" CssClass="btn btn-comment" ForeColor="White" Font-Bold="True"/></td></tr>
                    <tr>
                        <td>
                            <asp:RequiredFieldValidator ID="rfValidator" runat="server" ErrorMessage="RequiredFieldValidator" ControlToValidate="txtNewComments" 
                                ForeColor="Black" ValidationGroup="SaveComment" Font-Bold="True">You must enter a comment!</asp:RequiredFieldValidator>
                        </td>
                    </tr>
               </table>
            </asp:Panel>

            <cc1:ModalPopupExtender ID="modal" runat="server" TargetControlID="bttnHidden" PopupControlID="pnlComment" CancelControlID="btnCancel" BackgroundCssClass="modalBackground"></cc1:ModalPopupExtender>
            <br />
            <asp:HiddenField ID="Hidden" runat="server" value="-1"/>
            <asp:HiddenField ID="bStatus" runat="server" />

        </ContentTemplate>
    </asp:UpdatePanel>

   <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" ChildrenAsTriggers="false" UpdateMode="Conditional" DisplayAfter="10">
        <ProgressTemplate>
                <div class="center">
                    <asp:Image ID="imgUpdateProgress" runat="server" ImageUrl="~/Images/loader.gif" AlternateText="Please wait ..." ToolTip="Please wait ..." />
                </div>
        </ProgressTemplate>
    </asp:UpdateProgress>   

</asp:Content>

非常感激任何的帮助！

标签： asp.netajaxupdateprogress

解决方案

您需要检查两点。

首先，如果您有任何 javascript 错误 - 此更新进度基于 javascrip，因此任何 javascript 错误都可以停止它的功能。打开控制台面板并检查 javascript 错误...

第二点是检查DisplayAfter属性 on UpdateProgress，即 500 毫秒的默认值。如果在这段时间内发生任何事情， UpdateProgress则不会显示。所以添加一个较低的值DisplayAfter来检查它。

推荐阅读