lundi 26 juin 2017

if checkbox is checked and using slideToggle

I'm using slideToggle to display image related forms when a checkbox is enabled and hide it if not checked.

My menu structure is as follows:

<ul>
<li class="menu-item">
    <p>
        <label><input type="checkbox">...</input>Upload Image?</label>
    </p>
    <div class="settings-image">...image related forms...</div>
</li>
<li></li>
</ul>

My jqyery code:

jQuery(document).ready(function($){ 

        $('input[type="checkbox"]').change(function(){
            $(this).toggleClass("option-checked", this.checked);            
            $(this).closest('li.menu-item').find('.settings-image').slideToggle();      
        });

});

This works just fine when the checkbox isn't checked yet on pageload. But not when the checkbox is checked on pageload. Neither the toggleClass name and setttings-image div shows by default.

Any help in the right direction is much appreciated.




Aucun commentaire:

Enregistrer un commentaire