Column visibility without full width table
Column visibility without full width table
I'm sure this is more straightforward than I'm making it. I currently store table states in a database for users to pick and choose from. Those using my app come from different parts of the company and have different preferences when it comes to which subset of data they wish to see. As it stands I've got everything saving and loading just fine except for column width.
My issue is that, as columns are removed via Buttons(ColVis), the full width of the table effectively has a min-width
which then causes the columns to expand to fill it. I say "effectively" because it doesn't seem that min-width
is the actual cause. I'm using a slightly edited version of ColResize to achieve column resizing. When using ColResize's handles to resize the columns I am able to shrink the columns to the point that the table's width goes below the lower limit I'd mentioned earlier.
I had hoped it would be a simple BootStrap CSS tweak, but if it is I wasn't able to figure that out. I could mess around with different col sizes but that seems like a hacky solution.
Here is a simple example. Just click the button to toggle a column's visibility. I would like for each column to retain it's width and for the table to shrink horizontally.
Answers
I'm afraid that this is probably one for the ColResize plug-in - to be honest I hadn't even realised there was such a plug-in available there! Column width is not something that DataTables itself stores in the state saving - it will simply compute the column width as required when the table is displayed.
Allan
It looks like the addon used one of yours as a base and as a result supports state saving/loading. I used PHPStorms JavaScript debugger(first time using it... I'm in love) to step through the state loading process. I was able to verify that the columns' width were set properly prior to applying the state's visibility settings. When enough columns are hidden the table hits that min-width-ish limit and the columns are forced to expad to fill that space. Once DataTables is fully initialized and the state loaded I can manually resize the columns via ColResize and the table no longer has that width limit.
The app i'm working on is on the companie's intranet and manages proprietary data or I would just link you to it. I can set up some dummy data if a video would be of any use.
It seems that addon has slipped under a lotnof peoples' radar. It's a shame because it's a really nice feature, especially for in-line-editing with Editor.
Thanks for the reply Allan, and a belated congratulations on the newest addition to your family.
Thanks :-).
I'm afraid I really would need a test case showing the issue to be able to offer any help with this one. It sounds like it will need live debugging in the browser.
Allan