当面板设置为 Display:None 时，如何将 ASP 面板内的控件设置为 Display:none答案

【问题标题】：How to set controls inside ASP panel to Display:none when panel is set to Display:None当面板设置为 Display:None 时，如何将 ASP 面板内的控件设置为 Display:none
【发布时间】：2019-11-05 23:25:53
【问题描述】：

我在控件内设置了多个面板，以根据版本号显示/隐藏内容。我的代码通过页面上的面板，如果版本号不匹配，则面板设置为 Display:None。我知道面板设置为 Display:none 因为我在调试时在 Chrome 开发人员工具中验证了它。问题是包裹在面板内的控件仍然显示在页面上。下面是如何在 html 中设置面板以及将面板设置为 display:none 的代码。请指教。谢谢你。

如果面板的 visible 设置为 false，它可以工作，但是我仍然需要控件在页面上呈现，即使它们没有显示。

<asp:Panel runat="server" version="1" ID="property113_v1">
    <tr>
        <td class="asterisk">&nbsp;</td>
        <td colspan="2" class="required">How to blank? </td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td colspan="2"><asp:RadioButtonList ID="property113" runat="server" RepeatDirection="horizontal" RepeatLayout="flow">
            <asp:ListItem Text="Yes" Value="Y"></asp:ListItem>
            <asp:ListItem Text="No" Value="N"></asp:ListItem>
        </asp:RadioButtonList>
        <asp:RequiredFieldValidator ID="property113Validator" runat="server" ControlToValidate="property113"
            ErrorMessage="" Display="dynamic" ValidationGroup="Page"><span class="validator">&nbsp;</span></asp:RequiredFieldValidator></td>
    </tr></asp:Panel>



    foreach (Panel pnl in p)
    {

        if (pnl.Attributes["Version"] != null)
        {
            if (pnl.Attributes["Version"] == ver)
            {
                pnl.Style.Add(HtmlTextWriterStyle.Display, "");
            }
            else
            {
                pnl.Style.Add(HtmlTextWriterStyle.Display, "none"); 
            }
        }
    }

}

【问题讨论】：

只是为了澄清-您是说带有style="display:none" 的父级的子HTML 元素是可见的？这有点难以置信...显示导致此问题的结果 HTML 可能会有所帮助。
检查呈现的 HTML 并确保 style='display:none' 实际呈现给父 div。我还建议添加一个 CSS 类而不是内联样式。如果您不需要客户端（浏览器）与隐藏面板交互，您可以设置pnl.Visible="false"。
请注意，您当前的代码将导致 HTML 无效，这可能是您的问题的一部分。 asp:Panel 呈现 div，这是 tr 的无效父级。
@AlexeiLevenkov 是的，尽管面板设置为 Display:None，但单选按钮和 td 仍然出现在页面上。
@JonP 如上所述，visible= false 有效，但是我需要面板内的控件仍能呈现。我检查了，div 设置为 Display:None 但没有控件在 div 内？这可能是什么原因？

标签： c# html panel

【解决方案1】：

您的代码导致 html 无效，div 不能是 tr 的父级。这导致了您的问题，有关演示，请参见：https://jsfiddle.net/4n6qkfzw/

你需要使用正确的元素tbody

更新你的 aspx 以使用类似的东西

<!-- use the tbody tag with runat=server here -->
<tbody runat="server" version="1" ID="property113_v1">
    <tr>
        <td class="asterisk">&nbsp;</td>
        <td colspan="2" class="required">How to blank? </td>
    </tr>
    <tr>
        <td>&nbsp;</td>
        <td colspan="2"><asp:RadioButtonList ID="property113" runat="server" RepeatDirection="horizontal" RepeatLayout="flow">
            <asp:ListItem Text="Yes" Value="Y"></asp:ListItem>
            <asp:ListItem Text="No" Value="N"></asp:ListItem>
        </asp:RadioButtonList>
        <asp:RequiredFieldValidator ID="property113Validator" runat="server" ControlToValidate="property113"
            ErrorMessage="" Display="dynamic" ValidationGroup="Page"><span class="validator">&nbsp;</span></asp:RequiredFieldValidator></td>
    </tr></tbody>

现在将您的代码更新为类似于：

List<HtmlGenericControl> tbodies = new List<HtmlGenericControl>{/*Populate your list here*/};
foreach (HtmlGenericControl tbody in tbodies)
{

    if (tbody.Attributes["version"] != null)
    {
        if (tbody.Attributes["version"] == ver)
        {
            tbody.Style.Add(HtmlTextWriterStyle.Display, "");
        } /*Probably actually don't need the else statment
        else
        {
            pnl.Style.Add(HtmlTextWriterStyle.Display, "none"); 
        }
       */
    }
}

【讨论】：