React Grid - Column Visibility

A Grid component with the TableColumnVisibility and ColumnChooser plugins provides the capability to hide or show table columns at runtime.

Basic Setup

Import the plugins listed above to enable a user to hide or show columns at runtime.

Uncontrolled Mode

In the uncontrolled mode, specify initially hidden column names via the TableColumnVisibility plugin’s defaultHiddenColumnNames property.

Controlled Mode

In the controlled mode, pass the hidden column names to the TableColumnVisibility plugin’s hiddenColumnNames property and handle the onHiddenColumnNamesChange event to control column visibility externally.

Disable Column Visibility Toggling

You can use the TableColumnVisibility plugin’s columnExtensions property to prevent changing to a specific column’s visibility.