Div显示隐藏不工作时，使用UpdatePanel在dev

本文关键字：使用 UpdatePanel dev 显示 隐藏 工作 Div | 更新日期: 2023-09-27 18:02:27

<div id="test1"  runat="server">
  <asp:UpdatePanel runat="server" ID="updTerms">
    <ContentTemplate>
      <asp:Button ID="btnSubmit"  Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click"/>
    </ContentTemplate>
  </asp:UpdatePanel>
</div>
<div id="test2" visible="false"  runat="server">
  <p>this is sample text.... bla bla bla</p>    
</div>
c#代码:

protected void btnSubmit_Click(object sender, EventArgs e)
{
  if (Page.IsValid) {
    // ...
    test1.Visible = false;
    test2.Visible = true;
  } else {    
    // do some thing...
  }
}

Div显示隐藏不工作时，使用UpdatePanel在dev

当更新面板被触发时，只有更新面板中的元素才会被更新。

由于您在更新面板中只有按钮，因此按钮是唯一要更新的东西，即使您在后面的代码中设置了它。你只需要把所有你想要更新的元素像这样包装在面板中。

<asp:UpdatePanel runat="server" ID="updTerms">
    <ContentTemplate>
        <div id="test1" runat="server">
            <asp:Button ID="btnSubmit" Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click" />
        </div>
        <div id="test2" visible="false" runat="server">
            <p>this is sample text.... bla bla bla</p>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

试试下面的代码:

<asp:UpdatePanel runat="server" ID="updTerms">
    <ContentTemplate>
        <div id="test1" runat="server">
            <asp:Button ID="btnSubmit"  Enabled="True" CssClass="asgButton" runat="server" Text="Submit" OnClick="btnSubmit_OnClick"/>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server" ID="updDiv2" UpdateMode="Conditional">
    <ContentTemplate>
        <div id="test2" visible="false"  runat="server">
            <p>this is sample text.... bla bla bla</p>    
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

和code-behind:

protected void btnSubmit_OnClick(object sender, EventArgs e)
{
    if (Page.IsValid)
    {
        test1.Visible = false;
        test2.Visible = true;
        updDiv2.Update();
    }
}

如果你从一个UpdatePanel更新控件，它们必须在同一个UpdatePanel或在另一个。

如果控件在另一个控件中，请确保在编辑后调用包含控件的UpdatePanel的Update。

确保在UpdatePanel上设置UpdateMode="Conditional"，否则Update会抛出异常。

在update panel内覆盖您的完整div ..你应该把需要更新的控件放在更新面板里面。

<asp:UpdatePanel runat="server" ID="updTerms">
    <ContentTemplate>
        <div id="test1" runat="server">
            <asp:Button ID="btnSubmit" Enabled="false" CssClass="asgButton" runat="server" Text="Submit" onclick="btnSubmit_Click" />
        </div>
        <div id="test2" visible="false" runat="server">
            <p>this is sample text.... bla bla bla</p>
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

我的建议是不要使用可见属性。相反，请执行以下操作

1)删除visible ="False" .使用Style="display:none"

<div id="test2" style="display:none"  runat="server">

2)在设计页面中添加以下javascript。

function divviZ()
{
    var test1=document.getElementById("<%=test1.ClientId%>");
    var test2=document.getElementById("<%=test2.ClientId%>");
    if(test2.style.display=="none")
    {test1.style.display="block";}
    else
    {test1.style.display="none";}
}

3)修改vb代码如下

protected void btnSubmit_Click(object sender, EventArgs e)
{
   if (Page.IsValid) {
   // ...
   test2.style("display")="block"
   ScriptManager.RegisterClientScriptBlock(this, this.GetType, "divviz", "javascript:divviZ()", True)
 } else {    
      // do some thing...
 }

}

相关文章：