diff options
Diffstat (limited to 'ecomp-portal-FE/client/bower_components/jqTree/_examples/01_load_json_data.html')
-rw-r--r-- | ecomp-portal-FE/client/bower_components/jqTree/_examples/01_load_json_data.html | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/ecomp-portal-FE/client/bower_components/jqTree/_examples/01_load_json_data.html b/ecomp-portal-FE/client/bower_components/jqTree/_examples/01_load_json_data.html new file mode 100644 index 00000000..c68461c7 --- /dev/null +++ b/ecomp-portal-FE/client/bower_components/jqTree/_examples/01_load_json_data.html @@ -0,0 +1,47 @@ +--- +title: Load json data in javascript tree +layout: page +js: examples/load_json_data.js +css: example.css +--- + +<p id="nav"> + <a href="../../index.html">« Documentation</a> + <a href="../02_load_json_data_from_server/" class="next">Example 2 »</a> +</p> + +<h1>Example 1 - load json data</h1> + +<div id="tree1"></div> + +<p> + In this example we load the data using the <strong>data</strong> option. + As you can see, the data is an array of objects. +</p> +<ul> + <li>The <strong>label</strong> property defines the label of the node.</li> + <li>The <strong>id</strong> is the unique id of the node.</li> + <li>The <strong>children</strong> property is an array of nodes.</li> +</ul> + +{% highlight js %} +var data = [ + { + name: 'node1', id: 1, + children: [ + { name: 'child1', id: 2 }, + { name: 'child2', id: 3 } + ] + }, + { + name: 'node2', id: 4, + children: [ + { name: 'child3', id: 5 } + ] + } +]; + +$('#tree1').tree({ + data: data +}); +{% endhighlight %} |