Search code examples
sortinghierarchyslickgrid

Slickgrid sorting a hierarchy

I have created a slickgrid hierarchy that has only 2 levels. The implementation of the hierarchy follow example 5 (https://6pac.github.io/SlickGrid/examples/example5-collapsing.html). I am using the following fork - http://6pac.github.io/SlickGrid. I want to sort only by the first level and have the children be in the same order. I tried adding the sortable property to the column, but that did not do anything. Any pointers on how to do this, I have no idea where to begin. As always many thanks in advance.

Solution

  • There's couple thing to note about that example you are referencing.

    1. You're on your own in regards to sorting the data in that Example, in short it means you'll have to add your own sorting functions and you'll end up with have to create a lot recursive functions (because hierarchical data is only sortable through recursion)
    2. It would be better to have pre-built to do that kind of work and since I needed that as well, I started a feature change that will eventually be merged into the 6pac/SlickGrid fork, I briefly talk about it in this issue post where you can see an animated gif. But never got time to finish it and I'm also waiting for someone's help to finish it. Unless we merge it has is
      • The feature I started is this Example from my fork which will eventually be merged. You could use that code and it should work, but you would also require a new SlickGrid Plugin that we created plugins/slick.treeData.js with some helpers for the recursion stuff (remember that sorting tree data with hierarchy requires you to use recursion, fun time that is... if you like pulling your hair)
    3. Or the final option would be to use my other lib Slickgrid-Universal which is a wrapper on top of SlickGrid (so it uses the 6pac/SlickGrid fork and is a dependency). This new lib that I created is framework agnostic (it could be used in any framework) and the sample is written in plain TypeScript (or JavaScript is you wish), there's 2 sample for hierarchical dataset Tree Data with parentId references and Tree Data with hierarchical dataset
      • what I wanted to add eventually in my lib is to support the SlickGrid built-in Aggregators but never got time to finish it (that is actually the same thing blocking option 2 that I wrote on top).
    4. If you're using other frameworks, I also created 2 other libs Angular-Slickgrid and Aurelia-Slickgrid which have the same feature set as option 3.

    So pick your choice from the list, it's not an easy one to work with but these are the current options, obviously the option 1 is the hardest since option 2-3 basically means that I did the work of option 1 already.

    The option 2 can be seen in this animated gif

    6iD2ly0AKA