afraid-scarlet

Anyone tried using react query with ag-grid server side datasource?

https://www.ag-grid.com/react-data-grid/server-side-model/ Basically, how can one provide reference to query?

const createDatasource = server => {
    return {
        // called by the grid when more rows are required
        getRows: params => {

            // get data for request from server
            const response = queryRef(params.request); <----------------

            if (response.success) {
                // supply rows for requested block to grid
                params.success({
                    rowData: response.rows
                });
            } else {
                // inform grid request failed
                params.fail();
            }
        }
    };
}

const createDatasource = server => {
    return {
        // called by the grid when more rows are required
        getRows: params => {

            // get data for request from server
            const response = queryRef(params.request); <----------------

            if (response.success) {
                // supply rows for requested block to grid
                params.success({
                    rowData: response.rows
                });
            } else {
                // inform grid request failed
                params.fail();
            }
        }
    };
}

React Data Grid: Server-Side Row Model

This section gives an overview of the Server-Side Row Model (SSRM) and provides guidance on when it should be used. Download v29 of the best React Data Grid in the world now.

4 Replies

correct-apricot•3y ago

How about queryClient.fetchQuery()? https://tanstack.com/query/latest/docs/react/reference/QueryClient#queryclientfetchquery

QueryClient | TanStack Query Docs

QueryClient The QueryClient can be used to interact with a cache:

afraid-scarletOP•3y ago

right. this works ! thank you

conscious-sapphire•3y ago

Hey @shyTiger#0099 Was wondering if you couls share more on how you implemented this with readt query im struggling slightly What is the server param? When you call createDataSource()

quickest-silver•7mo ago

I am curious if you are still using this pattern with ag-grid and I am also wondering how you have a grid refresh if you invalidate a query, since the dataSource wouldn't cause the grid to refresh to call the getRows. So say you have a grid open, you invalidate a query, the grid won't refresh because of that.

Gaming

Programming

Anyone tried using react query with ag-grid server side datasource?

Did you find this page helpful?