Hide div when checkbox is checked, honoring the initial checkbox state?

JavaScript
1

I’m trying to hide a table row actually, not a div, when a checkbox is checked in my form. I’m using this (JQuery):

$(document).ready(function(){
    $('#prog1').change(function(){
        if(this.checked)
            $('#faid').show('fast');
        else
            $('#faid').hide('fast');

    });
});

It works well, but if the checkbox is cleared when I load the page, the table row still shows. I have to check and uncheck the checkbox to get it to hide again. This is obviously non-ideal. Does anyone know how to hide the row/div when the initial state is checked, or do I have to use CSS and the JQuery toggleclass() function to do it?

Thanks!

2 
$(document).ready(function(){
    $('#prog1').change(function(){
        if(this.checked)
            $('#faid').show('fast');
        else
            $('#faid').hide('fast');

    });
   $('#prog1').trigger('change');
});

I believe the above would take care of that

3

And I believe that you are a genius! :smile:

It works beautifully, thanks.

1 Like