Hypothetical : Is it possible to combine rowgroup with the lenght menu to adapt its content ?

MelodyNelson

Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:

Hi,

I'm thinking of potential questions from the final users of the pages I'm making and I'm wondering if things could be achievable.

For example :
When I use rowGroup, I don't use the lengthMenu options and I put a large default value in pageLength.

Let's say that my table as 160 rows, I'm grouping them by year and have this results with RowGroup :
- Some text 2023, 13 rows
- Some text 2022, 48 rows
- Some text 2021, 53 rows
- Some text 2020, 46 rows

Each end group has subtotals + global totals at the end of the table.

Is it conceivable that the lengthMenu contains the following options ?
- 2023 or Some text 2023 (and showing the 13 rows when we chose it)
- 2022 (idem)
- etc
- All, showing all rows (like the standard option)

I don't need the JS code, just to know if it's possible or a crazy idea.

(I'm using online translation for some words but my brain think in french, I hope your understand me...)

Thank you

kthorngren

You could use lengthMenu to define the number of rows with the labels you want. However you will need to know this information before initializing Datatables. There isn't an API to change the length menu.

You could create your own select input with the list of options then use the page.len() to set the page length based on the selected option. You will need to count the rows in each group. This can be done in initComplete to build the select input. Use column().data() with unique(), similar to this example to get the unique values for the rowGroup dataSrc column. Looping through that use rows() with the row-selector as a function to get all the rows matching each unique value. Use count() to get the number of row. The count and unique value pairs are used to create the options list.

Doing the above doesn't mean that only the rows for the year selected will be shown or shown at the top of the page.

There is a solution on the forum for creating collapsed groups. See this example where you can click the rowGroup.startRender row to show./hide the group. It would be possible to programmatically open and close the groups based on what is selected in the length menu created above. Likely you will need to set the page length to -1 to show all rows and hide the rows of the unselected groups.

Another option might be to filter the table based on the year selected. When a year is selected you could set the page.len() to -1 to show all rows and filter the table for that year/group. If the user wants to see all rows then set the page length back to your initial large value.

TL;DR Yes is its possible

Kevin

MelodyNelson

Wow, thank you Kevin.
That's a lot of possibilities, I will keep that in mind for the future.
I still have a lot to do and to learn

kthorngren

I still have a lot to do and to learn

We all do

Kevin