在更新面板上使用计时器闪烁

时间:2013-09-13 10:48:59

标签: asp.net

我正在使用更新面板,我在其中设置了计时器。问题是无论何时更改计时器似乎所有更新面板都刷新并且闪烁,因为我无法在下拉列表中选择值。我该如何解决这个问题。

这是我的代码。

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
            <ContentTemplate>
                <asp:Label ID="Label1" Text="Remaining Time" runat="server"></asp:Label>
                <asp:Label ID="lblTimeSpan" Visible="false" Text="" runat="server"></asp:Label>
                <asp:Label ID="lblRemainingTime" Text="" runat="server"></asp:Label>
                <asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Enabled="true" Interval="1000" ></asp:Timer>`//Timer`
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
            </Triggers>
        </asp:UpdatePanel>

1 个答案:

答案 0 :(得分:2)

要将UpdatePanel彼此隔离,请为每个更新面板将属性:UpdateMode设置为Conditional。之后,为更新面板定义触发器。

示例:

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
     <ContentTemplate> 
         <asp:Label ID="Label1" runat="server" /><br /> 
         <asp:Button ID="Button1" runat="server" Text="Update Panel 1" 
         OnClick="Button1_Click" />         
     </ContentTemplate>
   <Triggers> 
    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" /> 
   </Triggers> 
 </asp:UpdatePanel>

// IInd Update Panel

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
 <ContentTemplate> 
    <asp:Label ID="Label2" runat="server" ForeColor="red" /> 
    <asp:Button ID="Button2" runat="server" Text="Update Panel 2" 
         OnClick="Button2_Click" /> 
 </ContentTemplate> 
 <Triggers> 
  <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" /> 
 </Triggers> 
</asp:UpdatePanel>

现在点击事件:

//按钮单击1

 protected void Button1_Click(object sender, EventArgs e)
    {
        Label1.Text = DateTime.Now.ToLongTimeString(); 

    } 

//按钮单击2

protected void Button2_Click(object sender, EventArgs e) 
{ 
     Label2.Text = DateTime.Now.ToLongTimeString(); 
}

正如您现在可以验证的那样, 当您点击Button1时,只刷新第一个UpdatePanel。它对第二个更新面板 [UpdatePanel2]

没有任何影响

同样,点击Button2,只会刷新第二个UpdatePanel。第一个UpdatePanel不会刷新。

因此,在您的情况下,为包含下拉列表的updatePanel设置UpdateMode =“Conditional”。并确保firstUpdatePanel中未包含第二个更新面板的触发器[此处的控件]。