Creating a sortable tree/grid in Javascript [closed]

StackOverflow https://stackoverflow.com/questions/193315

Question

I'd like to create a tree structure from JSON, but with multiple columns that can be sorted. I've seen lots of implementations of trees and grids but never one mixed.

Does anyone know of a plugin or feature for any Javascript toolkit that can make this happen so I don't have to re-invent the wheel here?

Was it helpful?

Solution

This seems pretty nice: http://www.max-bazhenov.com/dev/ux.maximgb.treegrid/index.html

Uses ExtJS, which has some licensing limitations you have to consider.

OTHER TIPS

I found all these components:

* seems not sortable

Personally I'm trying Treetable and, after some configurations (rummaging in the examples in the source of the documentation page...), I'm enjoying its simplicity and clarity.

After a long research for a treegrid, the best one that I came across is from jeasyui.com

http://www.jeasyui.com/demo/main/index.php?plugin=TreeGrid

enter image description here

The jstree plugin for jQuery tied with its plugin of jstree-grid can handle sorting (sorting is a plugin to the main jstree) that is quite flexible (and re-uses the jQuery UI theme you apply).

Is that the sort of grid you're looking for? You end up with a view very much like: jstree-grid-with-sort-themerolled

The sorting by column you'll have to manually add and then trigger a re-sort.

Here is an "official" example as well (top grid on the page), using the RowExpander UX.

http://extjs.com/deploy/dev/examples/grid/grid3.html

DHTMLX also has the TreeGrid JavaScript component (supports sorting and other grid-related features): http://dhtmlx.com/docs/products/dhtmlxTreeGrid/

(disclaimer: I work for DHTMLX)

Yet another treegrid with support for bootstrap. http://maxazan.github.io/jquery-treegrid/examples/example-bootstrap-3.html

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top