Category Archives: jsTree

[jsTree] Populating the tree using JSON

Posted on 2015 年 12 月 21 日 by cowman.chiang

Using Json

$('#using_json').jstree({ 'core' : 
{
    'data' : [
        'Simple root node',
        {
            'text' : 'Root node 2',
            'state' : {
                'opened' : true,
                'selected' : true
            },
            'children' : [
                { 'text' : 'Child 1' },
                'Child 2'
            ]
        }
    ]
} });

$('#using_json').jstree({ 'core' :

{

'data' : [

'Simple root node',

{

'text' : 'Root node 2',

'state' : {

'opened' : true,

'selected' : true

'children' : [

{ 'text' : 'Child 1' },

'Child 2'

]

}

]

} });

Using the alternative JSON format

$('#using_json').jstree({ 'core' : {
    'data' : [
        { "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },
        { "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },
        { "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },
        { "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" },
    ]
} });

$('#using_json').jstree({ 'core' : {

'data' : [

{ "id" : "ajson1", "parent" : "#", "text" : "Simple root node" },

{ "id" : "ajson2", "parent" : "#", "text" : "Root node 2" },

{ "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" },

{ "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" },

]

} });

Ref. Populating the tree using JSON

Posted in jsTree | Leave a comment

[jsTree] Expand and collapse buttons.

Posted on 2015 年 12 月 21 日 by cowman.chiang

&lt;input type="button" value="Expand All" onclick="$(‘#jsTreeID').jstree('open_all');"&gt;
&lt;input type="button" value="Collapse All" onclick="$('#jsTreeID').jstree('close_all');"&gt;

Ref: jsTree: adding Expand All and Collapse All buttons

Posted in jsTree | Leave a comment

Category Archives: jsTree

[jsTree] Populating the tree using JSON

[jsTree] Expand and collapse buttons.

Categories