Hide columns from right to left based on viewport width, hidden columns can be viewed by clicking

[glenpadua]

So this is essentially using the existing Detail Row plugin but show/hide columns based on the viewport similar to what datatables does - https://datatables.net/. This is a much cleaner experience than making the table scroll horizontally for responsiveness.

Any idea on how I might be able to do this? Plus will be a good feature to have! Thanks.

[SergeyAlexeev]

Hi,

Thank you for the idea. We don't have plans to support the described behavior in the nearest future. But, you can implement a similar functionality on your side. Use this sample as a starting point. The idea is using two plugins - TableColumnVisibility and TableRowDetail. The first one hides table columns. The second one renders information about hidden columns. Then, you can manage the hiddenColumnNames property depending on the window width.

[glenpadua]

This is great! Thanks a lot 👍

[giovanniantonaccio]

Hi, I'm trying to implement this same functionality but cannot open the example provided.

Any ideas of how I could implement this with the current version of the lib?

[MaximKudriavtsev]

Hi @giovanniantonaccio,

Here is an updated example.