Fancytree - Example

Use different methods to initialize the tree (Ajax, embedded <ul>, embedded JSON).
Also distinct nodes contain custom data using `data="..."` attributes.
See the LoadData Tutorial for details.

simple node (no explicit id, so a default key is generated)
Define key and tooltip using 'id' and 'title' attributes
item2 with html inside a span tag
this nodes adds class 'nolink', so no <a> tag is generated
using single a-tag to pass href (this would be clickable even if JavaScript is off)
defining custom node.data.foo = 'bar' using a data-foo attribute
defining node.data.foo = 'bar' using a data-json attribute
node with some extra classes (will be added to the generated markup)
Folder with some children
- Sub-item 3.1
  - Sub-item 3.1.1
  - Sub-item 3.1.2
- Sub-item 3.2
  - Sub-item 3.2.1
  - Sub-item 3.2.2
Document with some children (expanded on init)
- Sub-item 4.1 (active and focus on init)
  - Sub-item 4.1.1
  - Sub-item 4.1.2
- Sub-item 4.2
  - Sub-item 4.2.1
  - Sub-item 4.2.2
Lazy loading folder
Lazy loading folder (expand on init)

Example: Initialization Methods