JQuery - Hiding a checkbox and text

Question

I'm trying to hide an asp:CheckBox control depending on whether or not a certain link is visible on the screen. The checkbox has a text attribute = "hello". I'm trying to do this in JQuery.

I currently have the following:

$(document).ready(function(){

    hideCheckboxButtonIfLinkExists();

    }  );   

    function hideCheckboxButtonIfLinkExists() {

        var $myCheckBox = $('#<%= ckMyCheckBox.ClientID %>');
        var $myLink = $('#<%= lkMyLink.ClientID %>');

        if($myLink .is(':visible'))
        {
            $myCheckBox .show();                               
        } 
        else
        {
            $myCheckBox .hide();
        }    

    }

When I open the page if the link is not visible then the checkbox is not visible, however the checkbox text attribute "hello" is visible.

How can I hide this also?

Thanks in advance for your help.

davehauser · Accepted Answer · 2010-10-13 13:26:39Z

7

You can show/hide the label as well like this:

var $myLabel = $myCheckBox.next('label');

if($myLink .is(':visible'))
    {
        $myCheckBox.show();
        $myLabel.show();                 
    } 
    else
    {
        $myCheckBox.hide();
        $myLabel.hide();                 
    } 
}

I'm assuming you're using ASP.NET, so the above code should do it. If your checkbox is nested within the label, then you could just show/hide the label instead.

edited Oct 13, 2010 at 13:26

answered Oct 13, 2010 at 13:18

davehauser

5,9724 gold badges32 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

davehauser Over a year ago

Updated my code: closest() was wrong in this context. Use next() instead (or prev if the label's just before the input).

user229044 · Accepted Answer · 2010-10-13 13:35:03Z

2

Wrap the checkbox and its text in an element and show/hide that instead. The label element is probably the best choice, since it has other advantages:

<label id="clientid-label"><input type="checkbox"> Hello</label>

edited Oct 13, 2010 at 13:35

user229044♦

241k41 gold badges348 silver badges350 bronze badges

answered Oct 13, 2010 at 13:17

RoToRa

38.5k12 gold badges73 silver badges110 bronze badges

Collectives™ on Stack Overflow

JQuery - Hiding a checkbox and text

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related