Custom sorting based on multiple properties of the data

tom99

I want to have certain rows always being shown below certain other rows. Similar to something like child rows. My child rows do not have all properties of the parent rows (the unused properties are null). But one of its properties has the same value like the parent and so I know which child rows belong to which parent.

Example rows:
0: merchantId = 1, name = "parent1", GMS = 123, config = "A"
1: merchantId = 1, name = "child1-1", GMS = null, config = "B"
2: merchantId = 1, name = "child1-2", GMS = null, config = "C"
3: merchantId = 2, name = "parent2", GMS = 456, config = "D"
4: merchantId = 2, name = "child2-1", GMS = null, config = "E"

Row 1 and 2 are child rows of row 0 and should always appear directly below row 0.
Row 4 is a child row of row 3 and should always appear directly below row 3.

Now I want to be able to sort by "GMS" for example. Ascending would be like above, descending would be:
3
4
0
1
2

I cannot use DataTables child rows feature because I want to be able to scroll.

I can get everything to work with custom programming, except sorting.

I have looked at the example sorting plugins at https://datatables.net/plug-ins/sorting/ and almost all of them extend jQuery.fn.dataTableExt.oSort where one gets just the value of the column to be sorted, for example:

"case-sensitive-asc": function(a,b)

But I need also values of other data properties to be able to sort the rows by a specific column. So something that calls my function for sorting with parameters (row1, row2).

The "absolute" sorting plugin is way more complicated than the others, maybe something like this could work but I did not fully understand the code.

I also tried to use $.fn.dataTable.ext.order, where I have to return an array of values where DataTables then applies the sort to, but that does not help in my case either, because what would I return?

Any idea/hint would be greatly appreciated. Thanks!

kthorngren

I cannot use DataTables child rows feature because I want to be able to scroll.

Are you saying you are using the Scroller extension which doesn't support child rows or scrollX and/or scrollY which does support child rows?

Since you aren't using child rows are the "child' rows part of the standard table rows?, for example:

1: merchantId = 1, name = "child1-1", GMS = null, config = "B"

If they are part of the regular rows you might be able to use orderFixed on the merchantId column to keep the relevant rows together.

If this doesn't help please provide a simple test case so we can see what you have to offer suggestions.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

tom99

Thanks for the quick answer.

I'm using these options for scrolling:
scrollY: scrollerHeight,
scroller: {
displayBuffer: 2,
boundaryScale: 0.75
},
scrollResize: true,
deferRender: true,

So I guess, I am using the Scroller extension.

In my current "solution", my child rows are regular rows from DataTables's view. Thanks for the orderFixed hint, I will try that.

tom99

orderFixed is working for me, thank you.

Still, it would be cool if Scroller and Child Rows extension were compatible. With more than 1000 rows, initial rendering is too slow without Scroller.