Ag-grid server side pagination with client side sort & filter

Viewed 159

I am using React Ag-grid version 25.3.0. I'm implementing server side pagination and I have added the following properties to the Grid

rowModelType='serverSide'
paginationPageSize={PAGE_SIZE}
cacheBlockSize={PAGE_SIZE}
serverSideStoreType={ServerSideStoreType.Partial}

Then, inside the onGridReady function, I have configured the datasource

  const onGridReady = useCallback((params) => {
    params.api.showLoadingOverlay();
    params.api.setServerSideDatasource({
      getRows: (params) => {
        getData()
          .then((data) => {
            params.success({ rowData: data.rowData, rowCount: data.rowCount });
          })
          .catch((e) => {
            params.fail();
          });
      },
    });
  }, []);

With this, the server-side pagination is working fine. However, ag-grid is expecting the column filtering and sorting to happen in the server as well. Meaning, every time I click on a column header to sort it, the getRows function is fired. But, I would like to sort and filter records in the grid client-side. I want the sort and filtering work just like how it would work for rowModelType='clientSide'. I know it will only filter/sort the current page that I am on, but that's fine.

Help please !! Thanks in advance :)

0 Answers
Related