BCavvs BCavvs - 5 months ago 15
jQuery Question

Hiding a div based on ASP checkbox

I am trying to make an asp textbox/checkbox combo that will hide the textbox if the checkbox is checked but I cant get the jQuery/Javascript to work. I have tried many different solutions and havent gotten it to work so any help would be appreciated

ASP:

<div runat="server" id="editStartYear" class="productInfo">
Edit Start Year:
<asp:CheckBox ID="startDateCheckBox" runat="server" ClientIDMode="Static" Text="Unknown Start Date"/>
<asp:TextBox runat="server" ID="startBox" ClientIDMode="Static" Width="150" placeholder="Start Year"></asp:TextBox>
</div>


jQuery:

$(document).ready(function () {

$('#searchIcon').hover(function () {
$('#searchIcon').attr("src", "includes/images/searchIconHover.png");
}, function () {
$('#searchIcon').attr("src", "includes/images/searchIcon.png");
});
$('#searchBox').focus(function () {
$('#searchBox').attr("value", "");
});

$("#startDateCheckBox").change(function () {
if (this.checked) {
$("#startBox").hide();
} else {
$("#startBox").show();
}

});

});

Answer

You can add ClientIDMode="Static" in the asp.net markup for the check box and the text box. Then the client side javascript can be used to address the check box. Right now you have it as a server side control.

$("#startDateCheckBox").change(function() {
    if(this.checked) {
        $("#startBox").hide();
    } else {
        $("#startBox").show();
    }

});
Comments