Table resizing

I'm using a dataTables.net "ColVis" extension and just had a question about table reorder.
The "ColVis" gives the user the ability to select/deselect columns they would like to see in a table.
My Question: Is it possible to resize the table as the columns are being added or removed?

Here's my SharePoint site with it being implemented. (click the "show/hide" button)
http://isaac.issharepoint.com/ICTT/Shared%20Documents/modalTable.aspx
LVL 5
IsaacSharePoint Client Side DeveloperAsked:
Who is Participating?
 
Rainer JeschorCommented:
Hi,
here we go:
http://jsfiddle.net/EE_RainerJ/ej6hn6yf/

Changes:
- Set the property autowidth of the datatable to false
- remove the width of the table in HTML
- override the CSS class table.dataTable and set width: auto

HTH
Rainer
0
 
Rainer JeschorCommented:
Hi,
what do you mean with resizing the table?
Currently the table is set to 100% width, therefore the (remaining) columns take all the available space.

Here is a generic sample how to set the table (and/or) column widths:
http://jsfiddle.net/EE_RainerJ/zxr7nLh0/

HTH
Rainer
0
 
Rainer JeschorCommented:
BTW - there is no data shown as the site asks for credentials.
0
Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
IsaacSharePoint Client Side DeveloperAuthor Commented:
So, I am trying to implement the ColVis extension of datatable.net. It provides a 'show/hide' button and when clicked, it shows a small panel listing the column names of the table with checkboxes next to them. It allows you to select or deselect columns you want to see or not. When columns are deselected, the table width stays the same and does not resize.
So if I had 10 columns and deselected 9, the width is stays the same and does not resize to the 1 column remaining.
I need the table to resize.
0
 
IsaacSharePoint Client Side DeveloperAuthor Commented:
Here's my fiddle as an example.  Click on the "Show/hide columns" button
As you will see, once they select columns to remove, the table does not resize.  I want to be able to resize the table as the columns are hidden.

http://jsfiddle.net/isogunro/zxr7nLh0/11/
0
 
IsaacSharePoint Client Side DeveloperAuthor Commented:
Awesome! Thank you so much.  
I have a few other dataTable issues that I will post a little later.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.