How can I unchecked parent node if checked any child node in ztree?

460 Views Asked by At

Now in ztree, if checked any child node then it checked it's parent node also, but I want not to check it's parent node. Is there any way ?

var setting = {
        view: {
            dblClickExpand: true,
            selectedMulti: false,
            showLine: false,
            nameIsHTML: true,

        },
        check: {
            enable: true,                
        },
        data: {
            simpleData: {
                enable: true
            }
        },           
    };
1

There are 1 best solutions below

0
gaetanoM On BEST ANSWER

As per documentation:

setting.check.chkboxType:

When one node is checked or unchecked, control its parent node and its child node auto checked or unchecked. It is valid when [setting.check.enable = true & setting.check.chkStyle = "checkbox"]

Default: { "Y": "ps", "N": "ps" }

Hence, I suggest to use:

check: {
     enable: true,
    chkboxType: { "Y": "s", "N": "s" }
},

var setting = {
    view: {
        dblClickExpand: true,
        selectedMulti: false,
        showLine: false,
        nameIsHTML: true,

    },
    check: {
        enable: true,
        chkboxType: { "Y": "s", "N": "s" }
    },
    data: {
        simpleData: {
            enable: true
        }
    }
};
var zTreeObj;
var zNodes = [
    {name:"test1", open:true, children:[
        {name:"test1_1"}, {name:"test1_2"}]},
    {name:"test2", open:true, children:[
        {name:"test2_1"}, {name:"test2_2"}]}
];

zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/zTree/zTree_v3@master/css/demo.css" type="text/css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/zTree/zTree_v3@master/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/zTree/zTree_v3@master/js/jquery.ztree.all.js"></script>


<div>
    <ul id="treeDemo" class="ztree"></ul>
</div>