Pagination

Pagination chooses which aggregate row groups to request. It does not page raw source facts and then calculate partial totals in the browser. The backend aggregates the authorized report before returning the requested window.

Live row paging

Interactive example

Page analytical row groups

Change row pages through direct grid properties while HttpPivotRemoteStore transports the analytical load.

The example loads when visible.

Reset

Use the native pagination panel to change page. The example shows the actual PivotLoadRequest, requested row offset/limit, accepted axis total and HTTP route. One row group is shown per page; each group may represent multiple underlying facts.

Configure direct properties

import { PivotPlugin, HttpPivotRemoteStore, type PivotConfig } from '@revolist/pivot';
import { PaginationPlugin } from '@revolist/revogrid-pro';

const remoteStore = new HttpPivotRemoteStore({ baseUrl: '' });
const pivot: PivotConfig = {
  rows: ['region'], columns: [],
  values: [{ prop: 'sales', aggregator: 'sum' }],
  aggregationSemantics: 'server',
  engine: {
    mode: 'server', remoteStore, viewId: 'sales', fieldsVersion: 'v1',
    rowAxis: { offset: 0 },
    columnAxis: { offset: 0, limit: 20 },
  },
};
grid.plugins = [PivotPlugin, PaginationPlugin];
grid.pagination = { itemsPerPage: 50, initialPage: 0, total: 0 };
grid.pivot = pivot;

Use the dedicated grid.pagination and grid.pivot properties. The aggregation execution pin guards the selected server calculation path.

What changes on each page

Configuration or response	Meaning
grid.pagination.itemsPerPage	The requested analytical viewport.rowAxis.limit.
Current page	Becomes the analytical viewport.rowAxis.offset.
response.rowAxis.totalCount	Total aggregate row groups, used for grid.pagination.total.
engine.columnAxis	An independent analytical column window. The row paginator does not page columns.

Pivot handles page-change events and writes accepted totals back into the direct pagination property. Changing report structure resets the row offset. See PivotLoadRequest for the exact request fields and axis metadata for the returned counts and paths.

HTTP transport is a separate choice

HttpPivotRemoteStore sends the request to the fixed Pivot HTTP routes. PaginationPlugin changes that request’s row window. They work together, but you can also page a custom PivotEngineAdapter with the same panel. Do not configure Pagination’s raw-row loadData callback to bypass the Pivot engine: Pivot needs the analytical response and its independent axis metadata.

Without a pagination panel, set engine.rowAxis.offset/limit yourself and update the Pivot configuration through its public authoring lifecycle. Choose an adapter or store independently of whether you show page controls.

The live backend is a bounded in-memory HTTP simulation, not a deployed service. The application owns authentication, full-scope aggregation, truthful counts and stable ordering on its real endpoint.

Continue learning

How server-side Pivot works · Caching and refresh · Complete export.