SoFunction
Updated on 2025-03-08

node moves between two divs, and implements it with ztree

        } ;
//Initial data
        var zNodes =[
{ id:1, pId:0, name:"Parent node 1", open:true},
{ id:11, pId:1, name:"Leaf Node 1-1",open:true},
{ id:111, pId:11, name:"Leaf Node 11-1"},
{ id:112, pId:11, name:"Leaf Node 11-2"},
{ id:12, pId:1, name:"Leaf Node 1-2",open:true},
{ id:121, pId:12, name:"Leaf Node 12-1"},
{ id:122, pId:12, name:"Leaf Node 12-2"},
{ id:13, pId:1, name:"Leaf Node 1-3"},
{ id:2, pId:0, name:"Parent node 2", open:true},
{ id:21, pId:2, name:"Leaf Node 2-1"},
{ id:22, pId:2, name:"Leaf Node 2-2"},
{ id:23, pId:2, name:"Leaf Node 2-3"},
{ id:3, pId:0, name:"Parent node 3", open:true},
{ id:31, pId:3, name:"Leaf Node 3-1"},
{ id:32, pId:3, name:"Leaf Node 3-2"},
{ id:33, pId:3, name:"Leaf Node 3-3"}
        ];

        for(var i=0;i<;i++){
            leftDivStr+="{id:"+zNodes[i].id+",pId:"+zNodes[i].pId+",name:\""+zNodes[i].name+"\",open:"+zNodes[i].open+"},";
           }
        leftDivStr = (0,-1);
        leftDivStr+="]";
        rightDivStr += "]";

//Find all parent nodes of the moved node
        function findParentNodes(treeNode, parentNodes){
            parentNodes += "{id:"++",pId:"++
            ",name:\""++"\",open:"++"},";
            if(treeNode != null && ()!= null){
                parentNodes =findParentNodes((),parentNodes);

            }
            return parentNodes;
        }       
//Mobile node
        function moveNodes(zTreeFrom,treeNode,zTreeTo,divStrFrom,divStrTo){
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
            var parentNodes ="[";
            if( != null){
                parentNodes = findParentNodes(treeNode,parentNodes);
                parentNodes = (0,-1);
            }

            parentNodes +="]";
            //alert(parentNodes);
            var parentNodesArray = eval(parentNodes);
            ///////////////////////////////
            var nodes = "[";
            nodes+= "{id:"++",pId:"++",name:\""++"\",open:"++"},";
            nodes = operChildrenNodes(treeNode,nodes);
            nodes = (0,-1);
            nodes+="]";
            var nodesArray = eval(nodes);
            var divFromArray = eval(divStrFrom);
            var divToArray = eval(divStrTo);
for(var i = 0;i<;i++){//Delete node
                for(var j = 0;j<;j++){
                    if(divFromArray[j].id == nodesArray[i].id){
                        (j,1);
                    }
                }
            }

divToArray = (nodesArray);//Add nodes
            divToArray = (parentNodesArray);

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
            divFromArray = ();
            divToArray = ();
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

            if( == "treeDemo"){
                leftDivStr = ();
                rightDivStr =();
                $.($("#treeDemo"), setting, divFromArray);
                $.($("#treeDemo2"), setting,divToArray);

            }else{
                leftDivStr = ();
                rightDivStr =();
                $.($("#treeDemo2"), setting, divFromArray);
                $.($("#treeDemo"), setting,divToArray);
            }
        }

        
//Find all child nodes under the specified node
        function operChildrenNodes(treeNode,nodes){
if(!= undefined){//is the parent node, with children nodes
                for(var j = 0;j<;j++){
                    var childNode = [j];
                    nodes+="{id:"++",pId:"++",name:\""++"\",open:"++"},";
                    nodes = operChildrenNodes(childNode,nodes);
                }
}else{//No child nodes
            }
            return nodes;
        }

       
        $(document).ready(function(){
            zTreeObj1 = $.($("#treeDemo"), setting, zNodes);
            zTreeObj2 = $.($("#treeDemo2"), setting);
            $(function() {
                $("#toRight").click(function() {
                    moveNodes(zTreeObj1,()[0],zTreeObj2,leftDivStr,rightDivStr);
                });
                $("#toLeft").click(function(){
                    moveNodes(zTreeObj2,()[0],zTreeObj1,rightDivStr,leftDivStr);

                });   
                    $("#show").click(function(){
                        var leftDiv = new Array();
                        var leftDivStrArray = eval(leftDivStr);
                        for(var i = 0;i<;i++){
                            leftDiv[i] = leftDivStrArray[i].id;
                        }
                        var rightDivStrArray = eval(rightDivStr);
                        var rightDiv = new Array();
                        for(var i = 0;i<;i++){
                            rightDiv[i] = rightDivStrArray[i].id;
                        }
                    alert(leftDiv);
                    alert(rightDiv);

                });   
            });
        });

       
    </script>