Scroller with external scroll container?

osmestad

Hi,

We are using DataTables with the Scroller plugin on a potentially large table. I'm wondering if it is possible to use an outer element in the DOM as the scroll container? We have some meta information above the table that we would like to scroll out of the view to show more of the table at once, and to avoid having two scrollbars we would ideally only have a scrollbar on the container holding both the metadata and the table. Has anyone done this? either with Scroller or another solution?

Thanks for a great table solution!

Kind regards
Øyvind Smestad

allan

You can use an outer scrolling element certainly - but it will have no impact upon the built in scrolling or Scroller, since they _must_ use the element that DataTables uses to scroll the table's body.

Allan

osmestad

Okay, I was afraid of that. If I want one scrollbar only, I assume the only option would be to extend Scroller (or create a Scroller like plugin) that could attach to another DOM node and add/subtract the height of the metadata that is inside that container (but outside the table) for all the calculations Scroller does. Should that be possible or am I missing something that would make this impossible?

Øyvind

allan

The scrolling container DataTables uses is the table's body (or rather a div wrapper around it). The table is split into header, body and footer - done so the header and footer stay in place.

So if you injected meta data at the top of the scroller, it would be between the header and body. I presume that is not what you want?

Allan

osmestad

I guess I would need to toggle the header between two positions, either stuck to top of screen (in .dataTables_scrollHead) when table has been scrolled or placed between my meta data and the table (maybe as a visible thead in .dataTables_scrollBody) for the initial unscrolled view. This assuming the meta data is placed at the top of the dataTables_scrollBody container and then offsetting the position calculation of the table.

allan

Yeah - nasty... What about just injecting information into the header's container. Would that work? Bit of a hack...

Allan

osmestad

Nasty I know :) but the problem is I want this meta information to scroll off the screen, if I place it inside the header that would just work the same as having it before the DataTables container I think...

allan

I see - yup that is a little tricky. Injecting anything into the scrolling container is going to upset Scroller's calculations, so I would rule that out completely. Without scroller you could possibly inject a row and cell with colspan set to cover the width of the table - use fnDrawCallback to inject it into the top of the table on every draw. Bit messy, but I think that's the only way you'll get what you are looking for from DataTables without modifying the source.

Allan