Scrollable table

[Robertroid]

It would be nice if the table could be scrollable for when it overflows the container's max witdh or height. Probably including a wrapping div on the table, not including the table controls and paging (so they won't scroll along the table).

Nice table btw!

[JangoSteve]

This is certainly something that could be added I suppose. There's no easy way to do this with CSS, since adding overflow: scroll to the <tbody> requires you to also set display: block which then messes up the cell alignment.

In the meantime, you could use something like the tableScroll plugin alongside dynatable, which copies the <thead> to a separate div above the table so that the <tbody> can be placed in a container with scrolling overflow.

[Robertroid]

I came with a quick solution that works quite well in my dataset. The basic approach is to wrap the table in a <div> with overflow: auto; and width: 100%, after rendering the controls at top and bottom.
At the end of mergeSettings.processAll(), before this.$element.trigger('dynatable:afterProcess', data);, I added this.$element.wrap($('<div class="dynatable-scroller"></div>'));. Now, for some tables that would like to not be scrollable, I added a features.scrollable = true, and a condition if scrollable is true, then throw the div.

Sorry for adding my change like this, but I'm at work now and still don't know yet how to add a change here.

[JangoSteve]

Oh interesting, I thought you meant making the table scrollable with the table header (<thead>) staying statically in place, which is harder and what that other plugin does. But yeah, I can see how it'd be helpful to have the entire table scrollable with all the controls in view.

If you want to submit that patch as a pull-request, and you're good with our Contributor Guidelines, I'll gladly pull it in. If not, just let me know and I can re-implement what you described here.