Home / Tables / jQuery treetable - Display a tree in an HTML table
jQuery treetable - Display a tree in an HTML table

jQuery treetable - Display a tree in an HTML table

Download Demo
  • Overview
  • Documents
User Rating: 3.7/5 ( 6 votes)
Your Rating:

jQuery treetable is a plugin for jQuery, the 'Write Less, Do More, JavaScript Library'. With this plugin you can display a tree in an HTML table, e.g. a directory structure or a nested list. Why not use a list, you say? Because lists are great for displaying a tree, and tables are not. Oh wait, but this plugin uses tables, doesn't it? Yes. Why do I use a table to display a list? Because I need multiple columns to display additional data besides the tree.

Unobtrusiveness

One of the goals of jQuery treetable is to be as unobtrusive as possible. Being 'unobtrusive' is very cool nowadays, so that was an important requirement. But it is cool for a reason: it keeps your HTML documents clean and it allows the code to degrade nicely when Javascript is not available.

The treetable plugin only requires that you add specific data attributes to every row that is part of your tree. The plugin uses these attributes to determine what your tree looks like. Otherwise, it would have to guess the structure of the tree and it wouldn't be very successful in doing that.

Features

  • It can display a tree of data in a table column.
  • It does this as unobtrusively as possible.
  • It allows branches to be collapsed and expanded (think of how a directory structure works in most file explorers).
  • It allows unlimited tree depth.
  • It uses the lightweight jQuery Javascript libray.

Source: ludo.cubicphuse.nl

Scroll To Top