Selective expand based on node's value

[inbasic]

It would be great if there is an option to decide whether a node show is expanded or not based on a user defined function.

In my case I just want to expand a single node.

[josdejong]

Do you have a more specific ideas on how this would work?

[inbasic]

Right now there is no method for selective expansion, I would like to have an option to help decide whether a node is expanded or not, something like this:

var editor = new JSONEditor(container, { isNodeExpanded: function (node) {... return node.value === "..."} });

[josdejong]

Do you want to be able for every individual node to expand it, collapse it, and check whether the node is expanded? (thus also be able to traverse over all nodes and their childs?)

[inbasic]

Yes, exactly. If I have understood the code correctly, right now during the tree construction, there is a this.expanded = false. I would prefer a user defined function decide on that.

[josdejong]

Ok got it. Interesting.

Maybe it is an idea not to expose the internal node object, but give a selection of useful parameters to the user defined function, something like this:

var editor = new JSONEditor(container, {
    expand: function (field, value, type, level) { ... }
});

Where the currently built in expand strategy is this:

var editor = new JSONEditor(container, {
    expand: function (field, value, type, level) { return (level == 0); }
});

[inbasic]

Great! Please keep me posted if there is any progress on this.

[Madd0g]

+1

I just came here to look for alternatives for expandAll(), would love to expand selectively.

[zenzei]

This seems like a great idea! And i think in some way is related to #297.

Is there any work around right now? Or maybe hide some nodes from the editor?

Thanks for the great work with the editor!

[josdejong]

If you really need, you can traverse over the internal nodes and call expand/collapse on them individually. For example:

// expand/collapse the root node
editor.node.expand(false /*recurse*/)
editor.node.collapse(false /*recurse*/)

// expand the 3th child node of the root node
editor.node.childs[2].expand(false /*recurse*/)

WARNING: this is no official API, if you build upon these internal structures you're code may break in future versions.

[mmssix]

This is a quick function I wrote that collapses a certain property based on field name. In my particular use-case I have a nested property called "properties" that is always huge. I wanted to collapse it so it didnt take up so much scrolling space.

function close_properties_recursive(childs) {
    // Will look at every property in the jsoneditor window and collapse any called "properties".
    // This is just a look-and-feel thing because the properties value is always huge and I want to hide it.
    // editor.node.childs[2].childs[0].childs[4].collapse(true)

    for (let index = 0; index < childs.length; ++index) {
        const element = childs[index];
        if (element.hasOwnProperty("field") && element.field === "properties") {
            element.collapse(true)
        }
        if (element.hasOwnProperty("childs")) {
            close_properties_recursive(element.childs)
        }
    }
}

Called with close_properties_recursive(editor.node.childs)

[gerbil]

i got editor.nodes undefined for mode: code; is there any way to use the same technique for json code mode?

[josdejong]

@gerbil I don't think so.