Issue when mixing row groups and horizontal scroll

I’m submitting a … (check one with “x”)

[X ] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here, post on Stackoverflow or Gitter

Current behavior

If you have row grouping and horizontal scrollbar enabled at the same time, it generates an infinite scrolling, adding blank space to the right.

Expected behavior

The table should scroll only the actual width

Reproduction of the problem

http://plnkr.co/edit/QpQthGIGIreYTZOH42Tn

What is the motivation / use case for changing the behavior?

I want to group the rows, and also be able to scroll horizontally

Please tell us about your environment:

Debian 8, VS Code, Angular CLI

• Table version: 10.3.0 on my pc, 11.1.3 on the plunkr

• Angular version: 4.2.4

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ] Chrome 62, Firefox 52

• Language: [all | TypeScript X.X | ES6/7 | ES5] TS 2.5.3

[unstephenk]

ok. I am busy as well. I will leave it like this until I get a chance to look at it.

[edugal-parkland]

I’m having the same issue with grouping and scrollx: true. After several tries, i found out this solution :

Use the .wrap tag in jquery to append a div with overflow-x: scroll to your table in the InitComplete function

var tableSettings = {
            dom: "Blfrtip",
            ... (All other settings)
            initComplete: function () {
                $('#productRefundCostTable').wrap('<div style="overflow-x: scroll;">');
            }
        };