JavaScript Data GridRow Pinning

Pinned rows appear either above or below the normal rows of a table. This feature in other grids is also known as Frozen Rows or Floating Rows.

Set Pinned Rows using grid attributes pinnedTopRowData and pinnedBottomRowData.

Update the pinned rows using api.setGridOption('pinnedTopRowData', rows) and api.setGridOption('pinnedBottomRowData', rows).

pinnedTopRowData
any[]
Data to be displayed as pinned top rows in the grid.
pinnedBottomRowData
any[]
Data to be displayed as pinned bottom rows in the grid.

Cell Components

Cell Components are shared between Pinned and non-Pinned rows. To have different Cell Components for Pinned vs non-Pinned, use a cellRendererSelector.

Non Supported Items

Pinned rows are not part of the main row model. For this reason, the following is not possible:

  • Sorting: Pinned rows cannot be sorted.
  • Filtering: Pinned rows are not filtered.
  • Row Grouping: Pinned rows cannot be grouped.
  • Row Selection: Pinned rows cannot be selected.