Hello everyone,
I’m the author of Aurelia-Slickgrid and I’m currently facing some issues/challenges with a new feature with a Tree Data View structure (for example a file explorer view in a datagrid). I cannot release until I find how to Filter and Sort in a tree structure (possibly in a recursive fashion). I have an open Stack Overflow question, How to filter multiple properties of a parent child array which could be several tree level deep and if I can get an answer to it, I could eventually push this feature.
I’m facing the following 2 issues and I posted only 1 SO question so far here
- How to filter in a tree data structure from a flat parent/child array
- How to sort (multiple column sort) in a tree data structure
I kinda have Filtering/Sorting on the column that has the tree, but I cannot filter/sort on any other column(s) from the grid, which is what I’m trying to fix.
So please help if you can and answer the SO question and if you know how, I would be grateful and happy to release this new feature. Thanks.
Some demos can be seen here and here however, these demos have the issue that I wrote first previous paragraph.
Here’s a print screen of a possible Tree Data structure
2 Likes
I dont have an answer to your exact question but perhaps something like https://deepdash.io can assist with the deep filtering. As for multiple cols you can express the filter command in a dynamic way by providing multiple props expressions which you’d construct based on the user selection. It isnt the most performant solution for sure but would be a start.
This use case sounds like a typical challenge you have as a DB Admin where SQL is a great way to handle and optimize that bulk. Its for sure overkill but would be perhaps worth taking a look at a JS in-mem SQL Db like http://alasql.org/
3 Likes
Thanks I didn’t know about DeepDash, I was trying to resolve to only vanilla JS code but I might go with external lib if it comes as too hard to without and LoDash is a dependency for the Excel Export, so it wouldn’t add too much size I guess.
As for the other thing you mentioned, I’m mainly looking at just the frontend JS side, it’s a grid and I want to be able to use a hierarchical (tree data) dataset and pass it to the grid and be done with it. AG-Grid already supports that here but their implementation is of course not know and they expect a very strict structure, mine would be a lot less strict… anyway it’s a work project, we would use it as a purchaser quote grid and they require this to be a tree grid.
Thanks for the reply, I’ll definitely look into DeepDash as an alternative
2 Likes
Some update…
I got an answer on the SO Question I had opened, an awesome British guy living in Germany named (Alex) answered my question with barely 30-40 lines of Vanilla JS code and it’s now merged into my own lib.
I now have 2 live demos with Parent/Child ref (flat dataset) and with a Hierarchical Dataset (tree dataset).
Progess
[x] Tree Data View
[x] Tree Data Filtering
[x] Tree Single Column Sort
[ ] Tree Multi-Column Sort
[ ] Aggregation
3 Likes
Quick update on this, I just released a new Aurelia-Slickgrid release with the follow 2 new Examples
- Tree Data with Parent/Child refs - demo
- Tree Data from Hierarchical Dataset - demo
However note that the limitation I wrote earlier are still the same, I could only get the following to work:
Tree Data View
Tree Data Filtering
Tree Single Column Sort
Tree Multi-Column Sort
Aggregation
That’s it for now, I’m tired of working on this.
2 Likes
Hi, I found this discussion in google because someone mentioned Deepdash here and I was curious 
If you are still interested - feel free to open question issue in Deepdash project:
I’ll help you implement deep filtering / aggregation / whatever.
Best way would be if you create some fiddle or codepen with a sample data and describe what result do you want.
on deepdash.io under most of methods there is a link to correlated codepen - so you can just fork and update one and post it to deepdash github issues.
1 Like
@YuriGor
Thanks a lot for your help and comment, I managed to implement the feature with plain TypeScript code and that is what I was aiming for… the less dependencies, the better
What got me going was mostly this super helpful Stack Overflow answer.
Nonetheless, I’ll definitely keep a bookmark a DeepDash library, for other projects.
Cheers 
2 Likes
