mar10/fancytree

JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading

JavaScript

2,962

1,821 commits

updated Oct 1, 2026

See the code

README

logo Fancytree

GitHub version npm jsDelivr StackOverflow: fancytree

Fancytree is a JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading.

NOTE

Fancytree is considered feature-complete.
The code is still maintained and bugfixes will be commited. However do not expect new major features.

For a modernized and more capable alternative, consider upgrading to Wunderbaum.

Demo

sample

Get Started

ES6 Quickstart

import $ from "jquery";

import 'jquery.fancytree/dist/skin-lion/ui.fancytree.less';  // CSS or LESS

import {createTree} from 'jquery.fancytree';

import 'jquery.fancytree/dist/modules/jquery.fancytree.edit';
import 'jquery.fancytree/dist/modules/jquery.fancytree.filter';

const tree = createTree('#tree', {
  extensions: ['edit', 'filter'],
  source: {...},
  ...
});
// Note: Loading and initialization may be asynchronous, so the nodes may not be accessible yet.

See module loader support and API docs.

Credits

Thanks to all contributors.

checkboxes
drag-and-drop
fancytree
javascript
jquery-plugin
persistence
tree
treegrid

mar10/fancytree

JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading

JavaScript

2,962

1,821 commits

updated Oct 1, 2026

See the code

README

logo Fancytree

GitHub version npm jsDelivr StackOverflow: fancytree

Fancytree is a JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading.

NOTE

Fancytree is considered feature-complete.
The code is still maintained and bugfixes will be commited. However do not expect new major features.

For a modernized and more capable alternative, consider upgrading to Wunderbaum.

Demo

sample

Get Started

ES6 Quickstart

import $ from "jquery";

import 'jquery.fancytree/dist/skin-lion/ui.fancytree.less';  // CSS or LESS

import {createTree} from 'jquery.fancytree';

import 'jquery.fancytree/dist/modules/jquery.fancytree.edit';
import 'jquery.fancytree/dist/modules/jquery.fancytree.filter';

const tree = createTree('#tree', {
  extensions: ['edit', 'filter'],
  source: {...},
  ...
});
// Note: Loading and initialization may be asynchronous, so the nodes may not be accessible yet.

See module loader support and API docs.

Credits

Thanks to all contributors.

checkboxes
drag-and-drop
fancytree
javascript
jquery-plugin
persistence
tree
treegrid

Project health

Overall

4.2/10

Maintained

0/10

Code review

1/10
OpenSSF Scorecard

Significant stargazers

Michaël Zasso

879 followers · starred Jan 2016

Patrick H. Lauke

1,192 followers · starred Feb 2018

Maged Saeed

198 followers · starred Sep 2019

Chad Retz

336 followers · starred Mar 2016