Row Details Not Expanding Properly in OSX
Row Details Not Expanding Properly in OSX
pmc
Posts: 3Questions: 1Answers: 0
Hi,
I'm using DataTables 1.9.4 for the following website:
http://aia.cfa.harvard.edu/filament/
I'm baffled by an issue that only shows up under OS X El Capitan in all browsers on a MacBook. The same thing doesn't happen on the Red Hat or Windows machines I've tested, nor a MacPro desktop, though I can't recall the OS version.
When you click the row details icon to open the drop-down field, the table doesn't expand properly to show the additional info. This affects the last few rows on any page, but it's most problematic when you filter the table down to one element:
http://aia.cfa.harvard.edu/filament/?search=0998
The row details do open, but they can only be seen by scrolling within the small space occupied by the un-expanded single row.
Any ideas on what might cause this or a possible workaround?
Thanks!
This question has accepted answers - jump to:
Answers
I'm seeing the issue as well and it is caused by scrolling being enabled in the table and the scroll collapse option also being set.
You could call fnDraw after the child row is shown, or better yet, update to 1.10 (since 1.9 is no longer supported) where this issue should be resolved with the latest releases.
Allan
Hi Allan,
Thanks for your quick reply. I'm really glad that you also saw the issue because otherwise I'd think I'm crazy... My attempt at the fnDraw solution worked on the first try, which is very suspicious, so I removed the line and it worked without it. Sure enough, I don't see the issue anymore on the live version. I am thoroughly mystified. I will take a look on another machine when I get a chance.
Thanks,
Patrick
P.S. I will be sure to use 1.10 next time I'm implementing DataTables. Just trying to get a quick fix for this, since I'm no longer actually working there. I'm sure it's frustrating to respond to inquiries about an outdated version...
A proper fix for this is to use
min-heightfor the scrolling container height (which 1.10 does), rather thanheightas 1.9 does. You could hack the 1.9 source to do that if you need it.Allan
Thanks, Allan.
I am able to resolve the issue using either fnDraw or
min-height. I may not be applying themin-heightsolution exactly as you intended, though. I just stuck the following into the CSS at the top of my page, rather than editing any of the DataTables files:#container .dataTables_scrollBody { min-height: 230px; }That works by forcing the scroll body to be at least large enough for the row details, instead of the scroll body expanding to fit the row details. fnDraw is a bit nicer in that respect because the scroll body expands/collapses nicely. Having to redraw the table slows it down a touch I think, though, so I'll probably use
min-height.Thanks again,
Patrick