Скрыть подробное поле с помощью JavaScript

Я использую подробное представление, чтобы показать запись из базы данных для редактирования или для вставки новой записи. Когда флажок в одном из полей изменяется пользователем, я хочу скрыть другое поле. Чтобы избежать ненужных обратных передач, я хочу использовать JavaScript. Вот упрощенная версия того, что я имею до сих пор:

<script type="text/javascript">
    function HideShowPromo(chk) {
        if (chk.checked == true) 
            //.style.display = 'block';
        else 
            //.style.display = 'none';
    }
</script>

<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="false">
    <Fields>
        <asp:TemplateField HeaderText="Use Promotional Code:">
            <InsertItemTemplate>
                <asp:CheckBox ID="cbUsePromo" runat="server" />
            </InsertItemTemplate>
            <EditItemTemplate>
                <asp:CheckBox ID="cbUsePromo" runat="server" Checked='<%# Bind("_usePromo") %>' />
            </EditItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Promotional Code:">
            <InsertItemTemplate>
                <asp:TextBox ID="txtPromoCode" runat="server" MaxLength="10"></asp:TextBox>
            </InsertItemTemplate>
            <EditItemTemplate>
                <asp:TextBox ID="txtPromoCode" runat="server" Text='<%# Bind("_promo") %>' MaxLength="10"></asp:TextBox>
            </EditItemTemplate>
        </asp:TemplateField>
    </Fields>
</asp:DetailsView>      

и код позади:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        DetailsView1.DefaultMode = DetailsViewMode.Insert;              
        ((CheckBox)DetailsView1.FindControl("cbUsePromo")).Attributes.Add("onclick", "HideShowPromo(this)");
    }
}

Я был в состоянии выбрать текстовое поле "txtPromoCode" и скрыть его, но он оставляет текст заголовка. Я хочу спрятать все поле.

1 ответ

Решение

Вы должны попытаться скрыть всю строку, поэтому, если сгенерированный HTML-код похож на:

<tr>
    <td>Header</td>
    <td><input id='txtPromoCode' /></td>
</tr>

Выберите txtPromoCode с помощью javascript и скройте txtPromoCode.parentNode.parentNode (первый родительский <td>второй <tr>)

Другие вопросы по тегам