Collapsable table columns
August 25, 2017 at 6:47pmCollapsable table columns
August 25, 2017 at 6:47pmI'm trying to come up with an easy way to allow a user hide and show a column in a table. Most examples I have found let you hide and show all the columns of a table (https://codepen.io/christianacca/pen/meevep). They often use checkboxes above the table.

While this is nice, its not quite what I am looking for because I just want the user to be able to manipulate one column. And just having a toggle for one column feels kinda strange.
Currently these are my explorations of a collapsed / displayed column. 

Anywho, would love to hear what you all think of collapsable tables and some of my explorations. I can't seem to recall if I have seen this implemented where the show/hide toggle is in the table header. Perhaps I'm trying to be a bit too clever and I should do a toggle above the table. What do you think?
August 25, 2017 at 7:16pm
Can you add a header to the table? I think if this list had a persistent header there could be an opportunity to house a toggle button.
http://nicelydone.club/products/lattice/list/
in the same way that this list has a 'toggle btwn list and grid view' button in the top right corner
Virgil Pana on dribbble has some cool table concepts https://dribbble.com/shots/1903644-Data-Grid
yeah, Anthony for the collapsed state I have an icon with a little arrow to the right to allow the user to open it up again.
Haha I've looked at the dribbble shot probably 20 times. I wish there were more table designs out there easily referenced. In this case I only want to allow 1 column to be toggleable so its a little strange to only have one item in that list displayed.
You might have constraints blocking this but would you be open to moving the image column to the far right? I imagine if that column were to the right of everything you'd have less content shifting and you wouldn't have to shrink the column title down to an icon
shoot, yeah i figured
quite the pickle