Checked checkbox-parent 1.0
Created Thursday 13th of November 2008 by Andreas Lagerkvist
Copyright © 2008 Andreas Lagerkvist (andreaslagerkvist.com)
Please have a look at the "Other Resources" for bug reports or further help on jQuery. Do not post bug reports or feature requests as comments to unrelated articles. If bug reporting on bugtracker.a-framework.org fails, e-mail me.
What it Does
This tiny plug-in adds and removes a 'checked'-class to input[type=checkbox]'s parents. Very useful if you want to style the entire wrapping <label>-element when its child-checkbox is checked.
How to Use
jQuery('form').checkedCheckboxParent(); would apply the plug-in to every checkbox in 'form'.
Example
Example Code
HTML
<div id="jquery-checked-checkbox-parent-example">
<p>
<label>
<input type="checkbox" name="dummy" /> Click me to try it
</labe>
</p>
</div>
JS
jQuery('#jquery-checked-checkbox-parent-example').checkedCheckboxParent();
Source Code
jQuery.fn.checkedCheckboxParent = function () {
return this.each(function () {
jQuery(':checkbox', this).each(function () {
var check = $(this);
var checkParent = function () {
if (check.is(':checked')) {
check.parent().addClass('checked');
}
else {
check.parent().removeClass('checked');
}
};
checkParent();
check.click(checkParent);
});
});
};
