Exposed Taxonomy field in views filters

Question

I have a taxonomy field in my view in filters and I have made it exposed to the users with selection type "dropdown" along with "Show hierarchy in dropdown" as checked.

I'm also using Better Exposed Filters (BEF) module where in its settings I have selected the option to display the exposed filter as "nested checkboxes/radio buttons".

Also under more options in BEF's settings I have selected "Add nested all/none selection" so that if the parent taxonomy term is selected then all the child taxonomy terms should also get selected and vice versa. But this thing is not working properly, after selecting the parent term all the child terms are not getting selected neither after selecting all the child terms the parent term by default is getting selected.

Can anyone suggest ideas to make this work properly. Thanks In advance!!

Answer 1

Solved out with following jQuery code:-

$('.bef-tree input:checkbox').click(function() {
            var $this = $(this);
            if ($this.is(':checked')) {
            // Check all child checkboxes
            $this.closest('li').find('input:checkbox').prop('checked', true).change();

            // If all siblings are checked, the also check the parent term
                if ($this.closest('li').siblings('li').find('input:checkbox[checked="true"]').length
                == $this.closest('li').siblings('li').find('input:checkbox').length
                ) {
                    $this.closest('li').parent().closest('li').find('input:checkbox').prop('checked', true).change();
                }
            }
            else {
            // Uncheck all child checkboxes
                $this.closest('li').find('input:checkbox').prop('checked', false).change();

            // Uncheck all parent checkboxes of this element
                $this.parentsUntil('ul.bef-tree').filter('li').each(function() {
            // NOTE: "this" is no longer the closure variable, but the filtered
            //       li elements we selected and are iterating through.
                $(this).find('input:checkbox:first').prop('checked', false).change();
                });
            }     
        });