1

我想我已经尝试了更新面板的所有可能组合，但我似乎无法让它工作。我有一个像这样的更新面板：

<asp:UpdatePanel runat="server" ID="upParent" UpdateMode="Conditional" ChildrenAsTriggers="False">
        <ContentTemplate>

       Some content...
     <div style="width:100%;text-align:center;">
                    <asp:Label ID="lblMainMessage" runat="server"></asp:Label>
                    <asp:UpdateProgress AssociatedUpdatePanelID="upParent" ID="UpdateProgress7" runat="server" DisplayAfter="100" DynamicLayout="True" Visible="True">
                        <ProgressTemplate>
                             <div class="loader ui-widget-overlay">
                                            Loading data, please wait...<br/><img style="border-style:none;" src="../../Images/ajax-loader.gif" alt="loading" />
                             </div>
                        </ProgressTemplate>
                    </asp:UpdateProgress>
        </div>
        <div>
        <asp:UpdatePanel runat="server" ID="upChild" UpdateMode="Conditional" ChildrenAsTriggers="False">
 <ContentTemplate>
                <asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="10000"></asp:Timer>
                                               <asp:GridView ID="gvChecklists" runat="server"
                                AutoGenerateColumns="False" >
                                <Columns>
                                        <ItemTemplate>
                                     <asp:TemplateField HeaderText="Ques. Ans. Yes">
                                        <ItemTemplate>
                                            <asp:Label ID="lblQuestionsAnsweredYes" runat="server" ForeColor="Green"
                                                Text='<%# DataBinder.Eval(Container, "DataItem.QuestionYesAnswered") %>' 
                                                ToolTip="Questions answered Yes."></asp:Label>
                                        </ItemTemplate>
                                        <FooterStyle HorizontalAlign="Center" />
                                        <HeaderStyle HorizontalAlign="Center" />
                                        <ItemStyle HorizontalAlign="Center" />
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Ques. Ans. No">
                                        <ItemTemplate>
                                            <asp:Label ID="lblQuestionsAnsweredNo" runat="server" ForeColor="Red" 
                                                Text='<%# DataBinder.Eval(Container, "DataItem.QuestionNoAnswered") %>' 
                                                ToolTip="Questions answered No."></asp:Label>
                                        </ItemTemplate>
                                        <FooterStyle HorizontalAlign="Center" />
                                        <HeaderStyle HorizontalAlign="Center" />
                                        <ItemStyle HorizontalAlign="Center" />
                                    </asp:TemplateField>
                                    <asp:TemplateField HeaderText="Ques. Ans. N/A">
                                        <ItemTemplate>
                                            <asp:Label ID="lblQuestionsAnsweredNA" runat="server" ForeColor="Gray" 
                                                Text='<%# DataBinder.Eval(Container, "DataItem.QuestionNAAnswered") %>' 
                                                ToolTip="Questions answered N/A."></asp:Label>
                                        </ItemTemplate>
                                        <FooterStyle HorizontalAlign="Center" />
                                        <HeaderStyle HorizontalAlign="Center" />
                                        <ItemStyle HorizontalAlign="Center" />
                                    </asp:TemplateField>
                                </Columns>
                                </asp:GridView>  
                                <asp:Image ID="imgLoader" runat="server" ImageUrl="/Images/ajax-loader.gif" /> 
                                </td>
                                </tr>
                                </table>   
                                </div>          
                                <div style="width:100%;text-align:center;">
                                    <asp:Label ID="lblspChecklists2" runat="server"></asp:Label>
                                </div> 
             </ContentTemplate>
                 <Triggers>
                    <asp:PostBackTrigger ControlID="btnChecklistExcel"/>
                     <asp:AsyncPostBackTrigger ControlID="timerChecklists" />
                </Triggers>
             </asp:UpdatePanel>

我想要完成的是由于它的大小而延迟加载一些 gridview 数据。所以我所做的只是将 gridview 包装在更新面板中。然后，我在此更新面板中放置了一个计时器，并将其设置为 10000（10 秒）用于滴答事件。我将事件 OnTick 设置为如下所示：

   protected void TimerChecklistsTick(object sender, EventArgs e)
        {
            LoadChecklistsSubPanel();
            timerChecklists.Enabled = false;
            imgLoader.Visible = false;
        }

LoadChecklistsSubPanel 只是获取一个数据集并将其分配给网格视图数据源并进行数据绑定。这一切都很好......但是我的问题如下：

请注意前面提到的父更新面板和子更新面板。在此我有一个与更新面板 upParent 关联的更新进度。但我的问题是，当 10 秒命中并触发计时器事件时，会显示此更新进度（实际上导致我的整个页面基本上加载）。我认为这不会发生，因为 updatemode 是条件并且作为触发器的子项是错误的。

我也尝试过 ChildrenAsTriggers=true，我尝试始终设置更新面板模式，我尝试了几乎所有方法，但我的问题仍然存在。就在 10 秒到达 UpdateProgress 时（显示正在加载数据，请等待显示覆盖。

除了我的网格视图被正确绑定，它在 10 秒后获取它的数据，等等。我唯一的问题是我似乎无法理解为什么 UpdateProgress 显示并覆盖我的整个屏幕，如果发生的只是我的嵌套子面板应该只更新。

4

1 回答 1

3

事实是 upPanel 没有更新，您可以通过在 upPanel 中放置一个值为“0”的标签并在代码隐藏中的 TimerChecklistsTick 下添加 lblTest.text +=1 来检查这一点。您可以看到该值没有任何变化。

其实问题是UpdateProgress控件，UpdateProgress控件不是一个强大的工具，你的期望应该不会很高。

如果你想要一个强大且可定制的 UpdateProgress，你应该使用 JavaScript 自己制作：

<script type="text/javascript">
    var postBackElement;
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(InitializeRequest);
    prm.add_endRequest(EndRequest);
    function InitializeRequest(sender, args) {
        postBackElement = args.get_postBackElement();
        if (prm.get_isInAsyncPostBack()) {
            args.set_cancel(true);
        } else {
            //Put your progress UI here
            //Check Trigger Id if needed.
            //Show an image or Hide another div or ...
        }
    }
    function EndRequest(sender, args) {
    }
</script>


但是解决方案...

但是我对您的代码玩了一点，发现如果您从 UpdatePanels 中删除计时器并将其完全放在它们之外，您的问题将得到解决。

    </ContentTemplate>
</asp:UpdatePanel>
//Outside the upParent
<asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="10000"></asp:Timer>

对于放置在子更新面板中的任何控件，问题仍然存在。我不知道是否有基础解决方案，但正如我所说，UpdateProgress 是一个简单快捷的解决方案，但在性能和灵活性方面并不完全好。


更新 这是对我有用的模拟代码（ASP.NET 4.5，Chrome 36）：

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default2.aspx.vb" Inherits="StackOverflowTests_WebVB.net.Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <asp:UpdatePanel runat="server" ID="upParent" UpdateMode="Conditional" ChildrenAsTriggers="False">
            <ContentTemplate>
                <asp:Label ID="lbl1" runat="server" Text="0"></asp:Label>
                    <asp:UpdateProgress AssociatedUpdatePanelID="upParent" ID="UpdateProgress7" runat="server" DisplayAfter="100" DynamicLayout="True" Visible="True">
                        <ProgressTemplate>
                            <div class="loader ui-widget-overlay">
                                Loading data, please wait...<br />
                                <img style="border-style: none;" src="../Images/loading.gif" alt="loading" />
                            </div>
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                <asp:UpdatePanel runat="server" ID="upChild" UpdateMode="Conditional" ChildrenAsTriggers="False">
                    <ContentTemplate>
                        <asp:Label ID="lbl2" runat="server" Text="0"></asp:Label>
                    </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="timerChecklists" />
                    </Triggers>
                </asp:UpdatePanel>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:Timer ID="timerChecklists" runat="server" OnTick="TimerChecklistsTick" Interval="1000"></asp:Timer>
    </div>
    </form>
</body>
</html>

代码隐藏：

Protected Sub TimerChecklistsTick(sender As Object, e As EventArgs)
    lbl1.Text += 1
    lbl2.Text += 1
End Sub

在输出中，lbl2 在没有完整回发的情况下开始计数，并且没有在每个 Tick 上显示 UpdateProgress 的内容。如果将 Timer 移到 upChild 中，可以看到 UpdateProgress 的内容会显示在每一个 Tick 上，但 lbl1 仍然显示 0，没有任何变化。

于 2014-07-28T19:33:39.290 回答