Refreshing ListGrid visible rows

[billw]

I'm using a SmartClient (SNAPSHOT-2011-01-06) ListGrid with a custom DataSource. Everything works fine, but after an initial fetch of data into the view, I need to periodically update it to reflect changes on the server. I've searched the forum but not found a clear answer.

The ListGrid fetched data in pages (default page size = 75) which is fine. Ideally, once the user scrolls to a given section, I only need to update the visible rows. I certainly could query the list grid for the visible rows and fetch the data myself (calling the method my custom data source uses), but is there a way to get the ListGrid to do this itself? When my update timer fires, the only way I can get a refresh is:

myGrid.invalidateCache();
myGrid.fetchData();

But this causes the grid to clear, and totally refresh. If the user scrolled down to a certain section of the data, this forces it to clear and scroll back to the top. I want the visible rows only refreshed in-place. If I call just fetchData(), it only fetches the first time, not after that because it already has the data. It does not re-fetch. Any suggestions?

Thanks,
Bill

[Isomorphic]

There's a complete sample of doing this on the public wiki (wiki.smartclient.com).

[billw]

Originally Posted by Isomorphic

There's a complete sample of doing this on the public wiki (wiki.smartclient.com).

Thanks. That worked. My updateView method became:

    this.updateView = function () {
        if (!initialUpdate) {
            dataGrid.invalidateCache();
            dataGrid.fetchData();
            initialUpdate = true;
        }
        else {
            var gridDS =  dataGrid.getDataSource();
            var request = {
                startRow : 0,
                endRow: (dataGrid.getVisibleRows()[1] + dataGrid.data.resultSize),
                sortBy: dataGrid.getSort(),
                showPrompt: false
            };
            var callback = function(dsResponse,data,dsRequest) {
                var resultSet = isc.ResultSet.create({
                    dataSource: dataGrid.getDataSource(),
                    initialLength: dsResponse.totalRows,
                    initialData: dsResponse.data,
                    sortSpecifiers: dataGrid.getSort()
                });

                dataGrid.setData(resultSet);
            };
            gridDS.fetchData(dataGrid.getCriteria(), callback, request);
        }
        startViewTimer();
    };

But this seems like a pretty common use case. Would this be worth adding to the ListGrid? Like "ListGrid.doRefresh()" ??

[Isomorphic]

Yes, that's where it's headed, we put such things on the wiki first so people can use them without switching to a development build.

[billw]

After examining this more carefully, although this example works, I am not sure it is working the way I expected.

When a ListGrid is connected to a DataSource, it coordinates the fetching and paginating the data based on the totalRows that it received in a DSResponse, and it creates and manages the ResultSets. In this example, the startRow is always 0. Isn't this the way a ListGrid would normally do it's fetch for initialData? If the actual data totalRows = 1000, and the ListGrid was scrolled to the bottom, this would cause all data to be fetched, which is not good. Can I just set the startRow to the first visible row, or will that interfere with however the ListGrid would normally manage its ResultSet when it first scrolled to a new position towards the end of the total data rows?

[billw]

At the time I first posted this, I was using an older version of SmartClient. Now using 8.3 (or possibly 9.x), and the new application still has the need to periodically refresh the visible rows of ListGrids. I see there is a refreshRow(N) method--not sure if this was there in the earlier version. I assume I could get the visible rows and do a refreshRow on each. But I believe this would cause a fetch from the server via the dataSource for each row. It would be great if there were a refreshVisibleRows() that would cause the grid to fetch the appropriate rows in one shot. Or is there a better way?

[Isomorphic]

refreshRow() is a longstanding API and does only what it says: redraws the visual appearance of the row, with no server fetch involved.

For a background refresh of all rows in the viewport, the method on the wiki is still the right approach.