JSON printing (treeview)

Question

I have a complex json string that looks like this:

    {
    "id":"2016666",
    "dt":"2012",
    "object_extends":[
        {
             "extend1":{
                "id":"2016666",
                "dt":"2012",
                "active":"true",
                "object_extend":[
                    {
                        "extend2":
                        {
                            "id":"2016666",
                            "secondary":null
                        },
                        "extend3":
                         {
                            "id":"2016666",
                            "pet":"willy"
                         }

                    }
                ]
            }

        }
    ]
}

Now i want to print this like a tree, but when searching for days i have to modify the json(which is not a option). How can i print this in a treeview? I tried for loops but each extend can have other attributes then other objects. Hope somebody can help me with this!

Community · Accepted Answer · 2017-05-23 12:00:31Z

3

Can you check these out:

How to generate Treeview from JSON data using javascript

https://github.com/lmenezes/json-tree

https://github.com/liuwenchao/aha-tree

https://github.com/AlexLibs/niTree

https://github.com/tamirs9876/JSON.Tree.Builder -- one of my fav

I think visit this and use which you like:

https://github.com/search?utf8=%E2%9C%93&q=json+tree&type=Repositories&ref=searchresults

Edit For Your Request :

To remove the null nodes in https://github.com/tamirs9876/JSON.Tree.Builder -- one of my fav :

Cover line 8 with

if(data[i] != null){
}

in JsonTreeBuilder.js

Last state of js file is like

.
.
var ul = $('<ul>');
            for (var i in data) {
                var li = $('<li>');
                if(data[i] != null){
                    ul.append(li.text(i).append(generateTree(data[i])));
                }
            }
.
.

edited May 23, 2017 at 12:00

CommunityBot

11 silver badge

answered Nov 19, 2014 at 14:40

caslaner

4133 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user3464409 Over a year ago

for jstree you have to alternate the json, which is not a option(already told that in the first post)

user3464409 Over a year ago

You are a hero! Youre fav saved me a lot of time. The only problem i have now is that is also displays keys with null values. Any idea how to change that when a value is null it does not display?

caslaner Over a year ago

i manipulated js file for your requirement, please follow the steps in the message.

user3464409 Over a year ago

You sir, are my hero!

Collectives™ on Stack Overflow

JSON printing (treeview)

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related