This sample demonstrates different types of grid cell selection options and an event to get complete information about the same.

More Details...


This feature provides interactive support to highlight rows, columns, values, and summary cells that you select. Selection can be done through either mouse or keyboard interaction. To enable selection, set allowSelectionproperty as true.

PivotGrid supports two types of selection which can be set using selectionSettings.type property. They are:

  • Single - Enabled by default. Allows the user to select single row or column or cell at a time.
  • Multiple - Allows the user to select more than one row or column or cell at the same time.

Also, there are three modes of selection which can be set using selectionSettings.mode property. They are:

  • Row - Enabled by default. Enables the complete row selection in a pivot grid.
  • Column - Enables the complete column selection in a pivot grid.
  • Cell - Enables the cell selection in pivot grid.
  • Both - Enables both the row and column selection in pivot grid.

To perform the multiselection, hold CTRL key and click the desired cells. To select range of cells, hold SHIFT key and click the cells.

While using the Pivot Grid in a touch device environment, tap over a row, column, or other cells. This results in a pop-up with a multiselect icon. Now tap the icon to proceed with multiselection.

In this demo, pick the selection type and selection mode from the properties panel in order to perform the desired selection process. The selected cell information can be seen in the Event Trace part with the help of the cellSelected event.