Remove expand/collapse icon when all columns are displayed

Lintz

I'm using the new responsive extension which is working great. My issue is once the screen gets to a certain size all the columns are visible and I want to hide the expand icon as it is not required.

Can this be done automatically or do I need to add some logic in the resize event to hide the expand/collapse icon?

Thanks.

Lintz

anyone?

Lintz

I found this was meant to be done automatically but because I had 2 hidden columns it fell over and always showed the expand button. Once I removed one of my hidden columns the expand button disappeared when all columns where visible.

So far so good until I loaded my page and although all my columns were visible the expand button was still being displayed. I dug through the code and the issue seems to be in the _detailsVis function.

In this function it gets a list of hidden columns by calling dt.columns(':hidden').indexes().flatten() but on page load this always returns the total number of columns in my table and as a result the haveHidden variable is always true. I have made my own function to find the correct hiddenColumns on page load and everything is now working as expected.

Can someone please confirm this bug so I can track it's progress in new releases.

Thanks.

allan

Can you link to a test case showing the problem so I can debug the issue and confirm the fix please. What you are looking for should already be the case, and it appears to work correctly in my examples.

Allan

Lintz

Hi Allan,

Test case can be found at http://live.datatables.net/meqijuze/1/edit?output

If you only have the Output screen visible and reload the page you'll see the expand button is visible. However, it should not be displayed as there are no more columns to show (as the first column is hidden).

allan

The first column is hidden (none) therefore there must always be a hidden column and therefore there must also be the control button visible.

If you don't want the first column to even be shown, simply don't include it as a column. This is easier if you use objects in the data source, but columns.data can be used with arrays as well.

Allan

Lintz

In my scenario I have an ID which is added to a hidden column so when a row is clicked I get the ID from the hidden column and then load a new page. If I exclude the ID column from the datatable won't an error occur because the number of columns in the data source doesn't match the number of colums in the datatable?

allan

It would do if you had a different number of columns in the HTML than from the Javascript, but there is no reason why you have yo use every property in the data source object.

Your example updated: http://live.datatables.net/meqijuze/3/edit - uses the columns.data option I mentioned before. As I said, it is easier with objects, but possible with arrays as well.

Allan

Lintz

In the updated example the expand button appears next to the first column header instead of appearing in the first td of each row.

Also, using your approach in the updated example if I clicked on a row can I get the first value from the datasource for that row?

Lintz

In the updated example the expand button appears next to the first column header instead of appearing in the first td of each row.

Also, using your approach in the updated example if I clicked on a row can I get the first value from the datasource for that row?

allan

In the header? That doesn't appear to occur for me when I use it.

can I get the first value from the datasource for that row?

Sure - just use row().data().

Allan