Column visibility check toggle switch

c.cazzaro@hirondelle.it

Hi

I am using Basic Column Visibility. I would like to replace default buttons in the dropdown with Bootstrap 5 check switch toggles.

Is there any way to achieve the result shown in the image below?
Thanks in advance

kthorngren

I don't believe there is anything built into the column visibility button to do this. You could create a custom button with the list of columns with the toggle. Then use column().visible() to toggle the visibility of the toggled column.

Kevin

c.cazzaro@hirondelle.it

Could you please provide a script for it? I tried but it's not working...

My table is quite simple, you can find it here:

https://codepen.io/christiancazzaro/pen/GRYZJJK

Thanks in advance

kthorngren

Looks like the code from this thread should work. It has checkboxes to toggle the columns and the event handler uses an HTML 5 data attribute containing the column index to toggle the column visibility. I adapted the code in this example:
https://live.datatables.net/vuvoviki/1/edit

Hope that gets you started.

Kevin