AG Grid infinite row model not working - cannot get grid to draw rows when it is in the middle of drawing rows

Question

When I'm using AG Grid infinite row model, I get the following error: cannot get grid to draw rows when it is in the middle of drawing rows. Your code probably called a grid API method while the grid was in the render stage. To overcome this, put the API call into a timeout, e.g. instead of api.refreshView(), call setTimeout(function() { api.refreshView(); }, 0). The code I'm using for infinite scroll model is following error text recommendation:

const onGridReady = (params: any) => {
        setGridApi(params.api);
        setGridColumnApi(params.columnApi);
        if (state && params.columnApi) {
            params.columnApi.applyColumnState({ state: state as ColumnState[], applyOrder: true });
        }
        if (sortModel && params.api) {
            params.api.setSortModel(sortModel);
        }
        if (filterModel && params.api) {
            params.api.setFilterModel(filterModel);
        }

        const updateData = (data: any) => {
            const dataSource = {
                rowCount: null,
                getRows: function (params: any) {
                    setTimeout(() => {
                        let lastRow = -1;
                        if (data.length <= params.endRow) {
                            lastRow = data.length;
                        }
                        params.successCallback(data, lastRow);
                    }, 500);
                },
            };
            params.api.setDatasource(dataSource);
        }

        fetchSparepart(`${process.env.REACT_APP_API_HOST}/spareparts?startRow=${params.startRow ?? 0}&endRow=${params.endRow ?? 50}`)
            .then(res => updateData(res))
    }

                <AgGridReact
                    localeText={AG_GRID_LOCALE_RU}
                    rowBuffer={0}
                    rowSelection={'multiple'}
                    rowModelType={'infinite'}
                    paginationPageSize={50}
                    cacheOverflowSize={2}
                    maxConcurrentDatasourceRequests={1}
                    infiniteInitialRowCount={50}
                    maxBlocksInCache={10}
                    paginationAutoPageSize={true}
                    pagination={true}
                    onGridReady={onGridReady}
                    onSelectionChanged={onSelectionChanged}
                    onSortChanged={onSortChanged}
                    onFilterChanged={onFilterChanged}
                    rowClassRules={rowClassRules}
                    onRowDoubleClicked={onSelectionChanged}
                    frameworkComponents={{
                        booleanCellRenderer: booleanCellRenderer
                    }}
                    context={{
                        methodFromParent
                    }}
                >
                ....

What I'm missing here?

In my case, the problem was the introduction of "rowClassRules", but I don't know how to fix it yet. — lilalinux
– lilalinux, Commented Sep 30, 2022 at 7:57

lilalinux · Accepted Answer · 2022-09-30 10:33:46Z

2

In my case, the problem was the introduction of "rowClassRules", in your case it might be a different function, but with the same reason:

The function accessed an undefined property which lead to an exception which apparently got silently caught by aggrid. I guess that way the flag, that it's currently redrawing, never got cleared and at the next iteration it detected that the rendering is still in progress, resulting in the above error.

=> Debug your callback functions, one of them is probably broken. In my case, I switched from cellClassRules to rowClassRules and missed that the "params" parameter had a different structure, i.e. a data property and no "value" accessor for each field, so I suddenly accessed undefined.

answered Sep 30, 2022 at 10:33

lilalinux

3,0614 gold badges45 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sarjerao Ghadage May 23 at 7:30

i too had the same same issue of "[rowClassRules]="deletedRowClassRules" deletedRowClassRules function has some issue after ag grid upgrade 31.x.x

Collectives™ on Stack Overflow

AG Grid infinite row model not working - cannot get grid to draw rows when it is in the middle of drawing rows

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related