jQuery TreeTables 1.1.1
Jun 11, 2019
Alex Hill
1 minute read

Gif of plugin in use

We just released a new npm package TreeTables for displaying tree data when using jQuery DataTables.

DataTables is a powerful and extremely well established plugin for displaying tabular data, but has no native support for tree (nested) data. Examples of tree data include family trees, phylogenetic trees, and organisational hierarchies.

The TreeTables plugin adds that support with an interface that is almost identical to that of DataTables.

Features include:

  • toggling individual rows open and closed
  • expanding or collapsing all rows
  • arbitrarily deeply nested data

Basic usage:

        const organisationData = [
            {tt_key: 1, tt_parent: 0, name: "CEO"},
            {tt_key: 2, tt_parent: 1, name: "CTO"},
            {tt_key: 3, tt_parent: 2, name: "developer"},
            {tt_key: 4, tt_parent: 1, name: "CFO"}
        ];

        $('#my-table').treeTable({
            "data": myData,
            "collapsed": true,
            "columns": [
                {
                    "data": "name"
                }
            ]
        });

Read the full documentation and download instructions on npm or GitHub




comments powered by Disqus