Asp 面板可见是真的，但面板不显示答案

【问题标题】：Asp Panel visible is true but panel is not displayingAsp 面板可见是真的，但面板不显示
【发布时间】：2021-08-03 01:55:54
【问题描述】：

我有一个内容页面，其中更新面板内有 3 个面板

<asp:UpdatePanel ID="updateOfEmployee" runat="server" UpdateMode="Conditional">
   <ContentTemplate>
     <asp:panel ID="verificationOfEmployee" BorderStyle="Solid" BorderWidth="1px" runat="server">
--some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
</asp:panel>
        </ContentTemplate>
    </asp:UpdatePanel>
    <asp:UpdatePanel ID="emp_Address_Update" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
  <asp:Panel ID="emp_Addresss_Panel" BorderStyle="Solid" BorderWidth="1px" runat="server">
--some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
</asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>
   <asp:Panel ID="emp_Other_Details" BorderWidth="1px" BorderStyle="Solid" runat="server">
--some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
 </asp:Panel>code

在页面加载第二个面板emp_Addresss_Panel.Visible = false;第三个面板emp_Other_Details.Visible = false；在按钮一的点击事件中，我试图将第二个和第三个面板的可见设置为 true，将第一个面板的可见设置为 false，但第二个和第三个面板在浏览器中不可见，我在第二个面板的 if 语句中检查可见属性并找到可见的第二个面板已设置为 true，但它没有出现在浏览器中。这是我在第一个面板的点击事件中的代码的一部分。

verificationOfEmployee.Visible = false;
                        emp_Addresss_Panel.Visible = true;
                        if(emp_Addresss_Panel.Visible==false)
                        {
                            emp_Addresss_Panel.Visible = true;
                        }
                        emp_Other_Details.Visible = true;

【问题讨论】：

你要非常小心。如果设置 visible = false，则面板不仅隐藏，而且在浏览器中也不会发送或渲染！！！ - 这意味着 ajax 或客户端 js 不能再隐藏/显示该信息。在这种情况下，我很强大 - 但 BEYOND STRONG 建议您使用 style="display:none" 或 display:in-line 隐藏/显示。所以不要使用可见来隐藏显示 - 使用/更改样式，因为当可见 = false 时，该控件不仅被隐藏 - 而且它也不会呈现或发送到浏览器。这意味着任何 ajax 或客户端代码都无法看到，也无法隐藏/显示该面板。
你好 Albert，我已经尝试在页面加载时使用样式显示，但结果是一样的。

标签： asp.net webforms

【解决方案1】：

默认情况下，UpdatePanel 的 AJAX 回发不会导致其外部的任何内容更新，包括另一个 UpdatePanel 中的控件。您有两种解决方案。

1.将每个Panel 移动到相同的UpdatePanel

<asp:UpdatePanel ID="updateOfEmployee" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel ID="verificationOfEmployee" BorderStyle="Solid" BorderWidth="1px" runat="server">
            --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
        </asp:Panel>            
        <asp:Panel ID="emp_Addresss_Panel" BorderStyle="Solid" BorderWidth="1px" runat="server" Visible="false">
            --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
        </asp:Panel>
        <asp:Panel ID="emp_Other_Details" BorderWidth="1px" BorderStyle="Solid" runat="server" Visible="false">
            --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
        </asp:Panel>
    </ContentTemplate>
</asp:UpdatePanel>

verificationOfEmployee.Visible = false;
emp_Addresss_Panel.Visible = true;
emp_Other_Details.Visible = true;

2。添加 Cross-UpdatePanel 触发器

注意：通过将AsyncPostBackTrigger 添加到第二个UpdatePanel，它可以在事件中从第一个UpdatePanel 刷新。请注意，您的第三个 Panel 不会更新，因为它不在 UpdatePanel 中，也不是它自己的一个。

演练： Cross-UpdatePanel Triggers

<asp:UpdatePanel ID="updateOfEmployee" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel ID="verificationOfEmployee" BorderStyle="Solid" BorderWidth="1px" runat="server">
            --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
        </asp:Panel>
        <asp:Button ID="updateButton" runat="server" Text="Update" OnClick="updateButton_Click" />        
    </ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="emp_Address_Update" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel ID="emp_Addresss_Panel" BorderStyle="Solid" BorderWidth="1px" runat="server" Visible="false">
            --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
        </asp:Panel>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="updateButton" EventName="Click" />
    </Triggers>
</asp:UpdatePanel>
<asp:Panel ID="emp_Other_Details" BorderWidth="1px" BorderStyle="Solid" runat="server" Visible="false">
    --some additional controls like textbox, dropdown list and validation control, visibility of all these controls set to true.
</asp:Panel>

protected void updateButton_Click(object sender, EventArgs e)
{
    verificationOfEmployee.Visible = false;  // will render
    emp_Addresss_Panel.Visible = true;       // will render
    emp_Other_Details.Visible = true;        // will NOT render
}

【讨论】：