Search code examples
javascriptjqueryjsonjavascript-objectsjqtree

build a tree json for jqtree from data


I am trying to create the tree json for the following data that builds a jqtree

var data = [
    {
        "director": "Name1",
        "name": "sub-sub-child1",
        "teamname": "sub-child1",
        "teamManager": "child1"
    },

    {
       "director": "Name1",
       "name": "sub-sub-child2",
       "teamname": "sub-child1",
       "teamManager": "child1"
    },
    {
        "director": "Name1",
        "name": "sub-sub-child2",
        "teamname": "sub-child2",
        "teamManager": "child2"
    },
    {
        "director": "Name2",
        "name": "sub-sub-child1",
        "teamname": "sub-child1",
        "teamManager": "child1"
    },
    {
        "director": "Name2",
        "name": "sub-sub-child2",
        "teamname": "sub-child2",
        "teamManager": "child2"
    },
    {
        "director": "Name3",
        "name": "sub-sub-child1",
        "teamname": "sub-child1",
        "teamManager": "child1"
    },
    {
        "director": "Name3",
        "name": "sub-sub-child2",
        "teamname": "sub-child2",
        "teamManager": "child2"
    }
];

console.log(data);

var aNode = [];
                var aTempNode  = [];
                $.each(data, function(index, value) {
                    //console.log(value);
                    var key = {};
                    if($.inArray(value.director, aTempNode) == -1) {
                        aTempNode.push(value.director);
                        key['label'] = value.director;
                        key['children'] = [{label: value.teamManager, children: [{label: value.teamname, children: [{label: value.name}]}]}];
                        aNode.push(key);
                    } else {
                        //console.log(aNode)
                        if(key['teamname'] == aNode.children) {

                        }
                    }

                });
                console.log(aNode);

fiddle

EDIT2

The tree should be in this form

Name1
 |
 |___child1
 |     |
 |     |___sub-child1
 |     |      |
 |     |      |___sub-sub-child1
 |     |      |___sub-sub-child2
 |     |
 |     |___sub-child2
 |            |
 |            |___sub-sub-child1
 |            |___sub-sub-child2
 |
 |____child2  

Edit1

I'm half way through it. I'm confused how to proceed from here. fiddle


Solution

  • Try this, You will get what you need in "temp" variable

    var temp = [];
    $.each(data, function(row, val) {
    	var director = $.grep(temp, function(v) {
    		return v.label == val.director
    	});
    
    	if (director.length) {
    		var teamManager = $.grep(director[0].children, function(v) {
    			return v.label == val.teamManager
    		})
    		if (teamManager.length) {
    			var teamname = $.grep(teamManager[0].children, function(v) {
    				return v.label == val.teamname
    			})
    			if (teamname.length) {
    				var name = $.grep(teamname[0].children, function(v) {
    					return v.label == val.name
    				})
    				if (!name.length) {
    					teamname[0].children.push({
    						label: val.name,
    						children: []
    					});
    				}
    			} else {
    				teamManager[0].children.push({
    					label: val.teamname,
    					children: [{
    						label: val.name,
    						children: []
    					}]
    				});
    			}
    
    		} else {
    			director[0].children.push({
    				label: val.teamManager,
    				children: [{
    					label: val.teamname,
    					children: [{
    						label: val.name,
    						children: []
    					}]
    				}]
    			})
    		}
    	} else {
    		temp.push({
    			label: val.director,
    			children: [{
    				label: val.teamManager,
    				children: [{
    					label: val.teamname,
    					children: [{
    						label: val.name,
    						children: []
    					}]
    				}]
    			}]
    		});
    	}
    
    });