0

目标:创建一个页面,在按钮单击时显示加载图像,处理完成后消失。

问题:我有一个带有 Ajax UpdatePanel 的页面,该页面最初可以正常工作,在单击按钮时显示加载页面,然后显示 GridView。然而,在那之后,页面不断刷新并将我的 GridView 恢复到其原始状态(我做了一些手动列调整OnRowDataBound,例如添加图例行、合并一些单元格、单元格背景颜色更改等)

该页面的结构如下:

在此处输入图像描述

我正在尝试包含一个 Ajax UpdatePanel,它在Generate Report按下按钮后显示加载图像。

在内容页面上,我基本上将用户控件(上图中以蓝色显示并在filterControl下面命名的报表控件)和内容(在 .aspx 页面中定义并绑定在代码隐藏中的网格视图)包装在更新面板中:

<asp:UpdatePanel ID="updatePanelControls" runat="server">
    <ContentTemplate>
    <uc:MultiLevelReportFilter ID="filterControl" runat="server" 
                                ReportTitle="Default Title"
                               InvisiblePanels="pnlMonths,pnlPeriods,pnlBusinessGroups,pnlDisplay,pnlBrands" 
                               DefaultAccountLevel="level4">
    </uc:MultiLevelReportFilter>

    <asp:LinkButton ID="thelink2" runat="server"></asp:LinkButton>
        <asp:UpdateProgress ID="updateProgress" runat="server">
            <ProgressTemplate>
                <div id="dvProgress" runat="server" style="background-color: aliceblue; left: 40%; position: absolute; text-align: center; top: 35%; vertical-align: middle;">
                    <div id="Div1" runat="server" style="background-color: #ffffff; border: 4px solid #DBE5F1; height: 100px; padding: 5px; text-align: center; vertical-align: middle; width: 100px; width: 300px; z-index: 1002;">
                        <asp:Image ID="Image2" runat="server" Style="margin-top: 25px" Height="50px" Width="50px"
                                   ImageUrl="~/Images/New/ajax-loader.gif" />
                    </div>
                </div>
            </ProgressTemplate>
        </asp:UpdateProgress>


<% Gridview here composed of manually bound ItemTemplate columns %>

</ContentTemplate>
</asp:UpdatePanel>

我想在内容页面上为用户控件中看到btnGenerateGenerate Report按钮添加一个触发器,但页面错误,因为btnGenerate它实际上不在页面上,而是在控件中:

在 UpdatePanel“updatePanelControls”中找不到触发器的 ID 为“btnGenerate”的控件。

这是结构不正确吗?我应该在用户控件或内容页面上使用 Ajax 吗?我正在尝试遵循这个MSDN 示例,但它没有任何包含母版页和用户控件的示例。

可能的原因?:我应该注意,我在母版页上使用 updatePanel 来异步更新带有当前时间的标签,如下所示:

<asp:Timer ID="Clock" runat="server" Interval="10000"></asp:Timer>

<asp:UpdatePanel ID="updatePanelClock" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="ClockLabel" runat="server"></asp:Label>
                        </ContentTemplate>
                        <Triggers>
                            <asp:AsyncPostBackTrigger ControlID="Clock" EventName="Tick"></asp:AsyncPostBackTrigger>
                        </Triggers>
                    </asp:UpdatePanel>

这是导致不断刷新的原因吗?

编辑:我添加了UpdateMode属性并将其设置Conditional在我调用报告控件的内容页面上。但是,页面仍然不断刷新。

4

2 回答 2

1

是的,每次更新面板回发都会执行整个页面生命周期。服务器处理的内容不会刷新该更新面板之外的任何内容,但所有代码都将执行,就好像它是一个完整的页面回发一样。

于 2013-08-14T19:12:19.710 回答
0

试试javascript函数

function myFunction() {
    var myVar = setInterval(function () { myTimer() }, 1000);
    function myTimer() {
        var d = new Date();
        var t = d.toLocaleTimeString();
        document.getElementById("Label1").innerHTML = "Current Time : " + t;
    }

此函数调用表单主体

<body onload="myFunction()">
于 2013-08-29T11:42:52.160 回答