Get started with jquery.fancytree CDN

MIT licensed

JQuery.Fancytree is a flexible and powerful tree view plugin for JS.

Tags:
  • ajax
  • jquery-plugin
  • lazy
  • table
  • tabletree
  • tree
  • treegrid

Stable version

Copied!

How to start using jquery.fancytree CDN


$(document).ready(function() {
  // Define the data for the tree
  var data = {
    title: "My Fancytree",
    children: [
      { title: "Item 1", key: "item1", children: [ { title: "Subitem 1.1", key: "subitem1.1" }, { title: "Subitem 1.2", key: "subitem1.2" }] },
      { title: "Item 2", key: "item2", children: [ { title: "Subitem 2.1", key: "subitem2.1" }, { title: "Subitem 2.2", key: "subitem2.2" }] },
      { title: "Item 3", key: "item3" }
    ]
  };

  // Initialize the tree with the data
  $("#tree").fancytree({ source: data });

  // Enable keyboard navigation and select the first node
  $("#tree").fancytree("option", "selectMode", 3);
  $("#tree").fancytree("focus", data.children[0].key);

  // Optionally, you can also enable checkboxes
  $("#tree").fancytree("option", "checkbox", true);
});
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions