Data disappears when virtual scrolling is used

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 When I use pagination on table with virtual scrolling ([scrollbarV]=“true”, fixed height of datatable-body) or just scroll, then load empty array and switch back to array with data, table looks empty, but when I scroll data starts to render normally.

Expected behavior I load some data into table, use pagination or scroll, then load empty array, then load data and it appears normally.

Reproduction of the problem I used your plunker template to reproduce this issue: http://plnkr.co/edit/Aqk78IrHxywjkre11BZH?p=preview

I added [scrollbarV]=“true” to the table, height: 500px for .datatable-body in style.css and 2 functions: one for loading data from server and another for loading empty array.

Reproduction steps:

1. Open http://plnkr.co/edit/Aqk78IrHxywjkre11BZH?p=preview and see empty table.
2. Click “Table with data” button and see rendered data in the table and pagination below.
3. Click pagination button (e.g. “3”), see data successfully scrolled to selected page in the table.
4. Click “Empty Table”, see that table doesn’t contain any data.
5. Click “Table with data” button again and see that the table is still empty, but item number (100 total), pagination and scroll bar are in place.
6. Scroll the table and see that data renders.

What is the motivation / use case for changing the behavior? This issue causes serious impact on using virtual scrolling.

Please tell us about your environment:

Windows 10, Chrome 58/Firefox 54 MacOS, Safari 10.1

• Table version: 9.3.0

• Angular version: 4.2.2

• Browser: Chrome 58, Firefox 54, Safari 10.1

[kassomeone]

Best Solution I found is

setTimeout(function () { document.getElementsByTagName('datatable-body')[0].scrollTop = 1; }, 1); setTimeout(function () { document.getElementsByTagName('datatable-body')[0].scrollTop = offsetY; }, 1);

the problem is when the rows are updated scroll must be moved to render the new rows hence the work around was to take scroll to 1 and reset to actual position.

[asachan2707]

@kassomeone, Your solution works for me but only in case of more results when v-scroll is available not for less results. Have you any solution for this one. FYR