Nested Checkbox : Checked / Unchecked Children With Parent Check

Hi I've got a form with nested Checkbox on three level With Jquery I need to checked/uncheked all the children when I check a parent level... and of course uncheck the parent if at

Solution 1:

See I have Implemented your requirement.

It is needed to make some changes in HTML which I have did in JSfiddle.

Total Jquery script is as follow:

<script type="text/javascript">
        $(document).ready(function () {
            $.extend($.expr[':'], {
                unchecked: function (obj) {
                    return ((obj.type == 'checkbox' || obj.type == 'radio') && !$(obj).is(':checked'));
                }
            });

            $(".floral input:checkbox").live('change', function () {
                $(this).next('ul').find('input:checkbox').prop('checked', $(this).prop("checked"));

                for (var i = $('.floral').find('ul').length - 1; i >= 0; i--) {
                    $('.floral').find('ul:eq(' + i + ')').prev('input:checkbox').prop('checked', function () {
                        return $(this).next('ul').find('input:unchecked').length === 0 ? true : false;
                    });
                }
            });
        });
    </script>

To see live demo:

JSFiddle