checkbox with treeview

sudheen

11y1.5k

(function($)
{
function Tree() {
var $this = this;
function treeNodeClick()
{
$(document).on('click', '.tree li a input[type="checkbox"]', function() {
$(this).closest('li').find('ul input[type="checkbox"]').prop('checked', $(this).is(':checked'));
}).on('click', '.node-item', function() {
var parentNode = $(this).parents('.tree ul');
if ($(this).is(':checked')) {
parentNode.find('li a .parent').prop('checked', true);
} else {
var elements = parentNode.find('ul input[type="checkbox"]:checked');
if (elements.length == 0) {
parentNode.find('li a .parent').prop('checked', false);
}
}
});
};
$this.init = function() {
treeNodeClick();
}
}
$(function() {
var self = new Tree();
self.init();
})
}(jQuery))

above jquery used for selecting parent node all child node wil be selected.but my requirement is checking child node parent should be selected ..please give me solutions

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Karthikeyan K11y ago
Hi sir,

If it is useful then kindly mark as Accepted answer

Karthikeyan K
0
Karthikeyan K11y ago
Hi sir,

Check live demo : http://jsfiddle.net/KarthikeyanK/jgjft83w/

HTML
Root

Child

Child

Sub child

Sub child

Child

Sub child

Sub child
JQUERY

$('#treeList :checkbox').change(function (){
$(this).siblings('ul').find(':checkbox').prop('checked', this.checked);
if (this.checked) {
$(this).parentsUntil('#treeList', 'ul').siblings(':checkbox').prop('checked', true);
} else {
$(this).parentsUntil('#treeList', 'ul').each(function(){
var $this = $(this);
var childSelected = $this.find(':checkbox:checked').length;
if (!childSelected) {
$this.prev(':checkbox').prop('checked', false);
}
});
}
});

OUTPUT
0