Ben Cavenagh
Ben Cavenagh

Reputation: 748

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();
        }

});

});

Upvotes: 0

Views: 778

Answers (1)

pparas
pparas

Reputation: 549

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();
    }

});

Upvotes: 2

Related Questions