ASP.NET UpdatePanel 隐藏/显示行取决于单选按钮

Question

这是单选按钮

<tr class="choose">
    <td>
        Are you a director or company secretary of this nonprofit?
    </td>
    <td>
        <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:RadioButtonList ID="isDirector" RepeatDirection="Horizontal" runat="server"
                    AutoPostBack="True" OnSelectedIndexChanged="isDirector_CheckedChanged">
                    <asp:ListItem Text="Yes" Value="True" Selected></asp:ListItem>
                    <asp:ListItem Text="No" Value="False"></asp:ListItem>
                </asp:RadioButtonList>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:RequiredFieldValidator ID="isDirectorCompleted" Display="None" runat="server"
            ErrorMessage="Are you company director/secretary must be selected." ControlToValidate="isDirector"></asp:RequiredFieldValidator>
    </td>
</tr>

那么这是我试图隐藏的行

<asp:UpdatePanel ID="UpdatePanel9" runat="server">
    <ContentTemplate>
        <tr runat="server" id="test">
            <td class="title">
                Director First Name:
            </td>
            <td>
                <asp:TextBox ID="DirectorfirstNametxt" runat="server" MaxLength="100" CssClass="input"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" Display="None" runat="server"
                    ErrorMessage="Director First Name is required." ControlToValidate="DirectorfirstNametxt"></asp:RequiredFieldValidator>
            </td>
        </tr>
    </ContentTemplate>
</asp:UpdatePanel>

我基本上想隐藏/显示整个 TR 但基本上它什么都不做，取决于是否使用 updatemode="conditional"它似乎可以工作，但会在屏幕顶部添加一个额外的 tr。

protected void isDirector_CheckedChanged(object sender, EventArgs e)
{
    if(isDirector.SelectedValue == "True")
    {
        test.Visible = false;

    }
    else
    {
        test.Visible = true;

    }
}

但现在我只想隐藏/显示基本的 <tr runat="server" id="test">并且不添加额外的 trs

编辑:只是不明白为什么不隐藏/显示 tr 而是保留现有的 tr。而不是隐藏/显示一个完全不同的。

Answer 1

老实说，我觉得表格把你搞得一团糟。

基本上您创建的标记是:

<table>
    <div id="theUpdatePanel">
        <tr><td>...</td></tr>
    </div>
</table>

还有那个<div>无效。您应该尝试将内容放入 <div>反而。我还使第二个更新面板成为有条件的，并触发了单选按钮。

<asp:UpdatePanel ID="UpdatePanel9" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <div runat="server" id="test">
            Director First Name:
            <asp:TextBox ID="DirectorfirstNametxt" runat="server" MaxLength="100" CssClass="input"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator5" Display="None" runat="server"
                ErrorMessage="Director First Name is required." ControlToValidate="DirectorfirstNametxt"></asp:RequiredFieldValidator>
        </div>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="isDirector" EventName="SelectedIndexChanged" />
    </Triggers>
</asp:UpdatePanel>

编辑 1:根据 HTML 规范，<table>元素不能直接包含<div>元素。 UpdatePanel 呈现为 <div> ，从而生成无效标记。

然而，以下都是有效的:

<div id="theUpdatePanel">
    <table>
        <tr><td>asdf</td></tr>
    </table>
</div>

或:

<table>
    <tr><td>    <div id="theUpdatePanel1">foo</div>    </td></tr>
    <tr><td>    <div id="theUpdatePanel2">bar</div>    </td></tr>
</table>

编辑 2 - 这个怎么样？

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<table>
<tr class="choose">
    <td>
        Are you a director or company secretary of this nonprofit?
    </td>
    <td>

                <asp:RadioButtonList ID="isDirector" RepeatDirection="Horizontal" runat="server"
                    AutoPostBack="True" OnSelectedIndexChanged="isDirector_CheckedChanged">
                    <asp:ListItem Text="Yes" Value="True" Selected></asp:ListItem>
                    <asp:ListItem Text="No" Value="False"></asp:ListItem>
                </asp:RadioButtonList>

        <asp:RequiredFieldValidator ID="isDirectorCompleted" Display="None" runat="server"
            ErrorMessage="Are you company director/secretary must be selected." ControlToValidate="isDirector"></asp:RequiredFieldValidator>
    </td>
</tr>
            <tr runat="server" id="test">
            <td class="title">
                Director First Name:
            </td>
            <td>
                <asp:TextBox ID="DirectorfirstNametxt" runat="server" MaxLength="100" CssClass="input"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" Display="None" runat="server"
                    ErrorMessage="Director First Name is required." ControlToValidate="DirectorfirstNametxt"></asp:RequiredFieldValidator>
            </td>
        </tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>