欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

bootstrap-treeview 全选与反选

程序员文章站 2022-06-08 13:55:19
...
function getChildNodeIdArr(node) {
    var ts = [];
    if (node.nodes) {
        for (x in node.nodes) {
            ts.push(node.nodes[x].nodeId);
            if (node.nodes[x].nodes) {
                var getNodeDieDai = getChildNodeIdArr(node.nodes[x]);
                for (j in getNodeDieDai) {
                    ts.push(getNodeDieDai[j]);
                }
            }
        }
    } else {
        ts.push(node.nodeId);
    }
    return ts;
}

function setParentNodeCheck(node) {
    var parentNode = $("#tree").treeview("getNode", node.parentId);
    if (parentNode.nodes) {
        var checkedCount = 0;
        for (x in parentNode.nodes) {
            if (parentNode.nodes[x].state.checked) {
                checkedCount++;
            } else {
                break;
            }
        }
        if (checkedCount === parentNode.nodes.length) {
            $("#tree").treeview("checkNode", parentNode.nodeId);
            setParentNodeCheck(parentNode);
        }
    }
}


$('#tree').treeview({
                                data: res.Data,
                                levels: 3,
                                expandIcon: 'glyphicon glyphicon-chevron-right',
                                collapseIcon: 'glyphicon glyphicon-chevron-down',
                                selectedBackColor: false,
                                selectedColor: '#337AB7',
                                showCheckbox: 1, //这里之所以写1,是因为我引得js源码里定义1为true
                                multiSelect: 1, //这里之所以写1,是因为我引得js源码里定义1为true
                                onNodeChecked: function (event, node) { //选中节点
                                    console.log(node);
                                    var selectNodes = getChildNodeIdArr(node); //获取所有子节点
                                    if (selectNodes) { //子节点不为空,则选中所有子节点
                                        $('#tree').treeview('checkNode', [
                                            selectNodes, {
                                                silent: true
                                            }
                                        ]);
                                    }
                                    var parentNode = $("#tree").treeview("getNode",
                                        node.parentId);
                                    setParentNodeCheck(node);
                                },
                                onNodeUnchecked: function (event, node) { //取消选中节点
                                    console.log(node);
                                    var selectNodes = getChildNodeIdArr(node); //获取所有子节点
                                    if (selectNodes) { //子节点不为空,则取消选中所有子节点
                                        $('#tree').treeview('uncheckNode', [
                                            selectNodes, {
                                                silent: true
                                            }
                                        ]);
                                    }
                                }
                            });