選中復選框時顯示文本框控件

Question

選中CheckBox時，我使用以下JavaScript來顯示帶有Calendar Extenders的兩個Textbox控件。 否則，它們將被隱藏。 （我隱藏了包含“文本框”控件的表行。）

<script type="text/javascript">
function forVisibleDateChecked(sender) {
    var rowDisplay = document.getElementById('<%= fromDateAndToDate.ClientID %>');
    rowDisplay.style.display = sender.checked ? 'inline' : 'none';
}
</script>

我的HTML代碼在這里：

    <tr>
        <td class="style2">
            <asp:CheckBox ID="chkVisibleControls" runat="server" 
               checked="false" onclick="forVisibleDateChecked(this)" />
        </td>
    </tr>

    <tr runat="server" id="fromDateAndToDate">
        <td class="style2">
            <asp:TextBox ID="tbxSetFromDate" runat="server"></asp:TextBox>
            <asp:CalendarExtender ID="tbxSetFromDate_CalendarExtender" runat="server" 
                Enabled="True" TargetControlID="tbxSetFromDate">
            </asp:CalendarExtender>

            <asp:TextBox ID="tbxSetToDate" runat="server"></asp:TextBox>
            <asp:CalendarExtender ID="tbxSetToDate_CalendarExtender" runat="server" 
                Enabled="True" TargetControlID="tbxSetToDate">
            </asp:CalendarExtender>
        </td>
    </tr>

如果我沒有在“ Page Load方法”中將表格行“ Visble設置為“ false ，則此方法有效。

fromDateAndToDate.Visible = false;

但是默認情況下，加載頁面時，這兩個日期時間選擇器在用戶決定設置日期范圍（從日期到日期）之前是不可見的。 任何幫助都感激不盡。

Answer 1

不將它們作為服務器控件怎么辦？ 您可能需要將某些asp.net控件更改為普通的HTML控件。

<script type="text/javascript">
function forVisibleDateChecked() {
    var rowDisplay = document.getElementById('fromDateAndToDate');
    rowDisplay.style.display = sender.checked ? 'inline' : 'none';
}
</script>

HTML：

    <tr id="fromDateAndToDate" style="display:none">
        <td class="style2">
            <asp:TextBox ID="tbxSetFromDate" runat="server"></asp:TextBox>
            <asp:CalendarExtender ID="tbxSetFromDate_CalendarExtender" runat="server" 
                Enabled="True" TargetControlID="tbxSetFromDate">
            </asp:CalendarExtender>

            <asp:TextBox ID="tbxSetToDate" runat="server"></asp:TextBox>
            <asp:CalendarExtender ID="tbxSetToDate_CalendarExtender" runat="server" 
                Enabled="True" TargetControlID="tbxSetToDate">
            </asp:CalendarExtender>
        </td>
    </tr>