Vaadin-grid: Grid should show empty rows for non-loaded data from remote-data-provider

[limonte]

Live demo: https://jsfiddle.net/6r5htd05/78/

Step:

1. Switch to 'Slow 3G' connection in the Network panel
2. Scroll down the grid

Expected: empty rows are shown for not-yet-loaded data

Actual: loaded data is shown in the wrong place

[limonte]

This example works exactly like expected: http://vasa.demo.vaadin.com/sampler/#ui/grids-and-trees/grid/shared-datasource - empty rows for not-yet-loaded data (switch to Slow 3G for better visibility)

[jojule]

Looks like a bug. We definitely should empty the recycled cells as they have old contents before calls to data source return.

[jojule]

Also it would be really beneficial if in this kind of case data source could (if developer so chooses) return parts that are known on the client asap and come back with lazily loaded parts later. In this case it would mean that row numbers would be immediately visible and the rest would be shown later.

[tomivirkki]

In this case it would mean that row numbers would be immediately visible and the rest would be shown later.

That's pretty much the reason why the loading rows aren't completely hidden, but styled semi transparent instead. Since the developer can place anything in the column templates, the grid can't know (without additional API) which cell content should be hidden while loading and which should be left visible.

We actually used to have the whole row content hidden while loading in early development versions of grid 2 but the outcome was considered flickery and it hid possible cues that might assist in scrolling large grids (the index numbers for one).

The current approach allows the user to make adjustments on this behaviour quite flexibly. Here's an example (It accesses grid's _cache API's but the data source could just as well keep track of the loaded items itself).

We could consider adding loading attributes to the individual rows that are expecting new data. This could give more leverage for the developer in styling the loading content the way he desires without him having to keep track of the loaded items.

[limonte]

The current approach allows the user to make adjustments on this behaviour quite flexibly. Here's an example (It accesses grid's _cache API's but the data source could just as well keep track of the loaded items itself).

We should not force users to use additional wrapper with some magic helper method <div class$="[[_loadingContentClass(index, item)]]">[[item.name]]</div> for every single column template in order to get the default expected behavior.

We could consider adding loading attributes to the individual rows that are expecting new data. This could give more leverage for the developer in styling the loading content the way he desires without him having to keep track of the loaded items.

That would be great! Currently, the loading attribute on grid doesn't provide the ability to style only rows that are expecting new data.