Column menu PRO
Run column commands such as sorting, filtering, and pinning in one place.
Options
Changes below update the Grid and code immediately.
Column menus are enabled here. Click the Product header's menu button.
View code
Sample data included in the code · 6 rows
Usage guide
#Provide sorting, filtering, and pinning commands in a menu beside column headings.
Try it yourself
- Open a column menu
Column menus are enabled here. Click the Product header's menu button.
- Apply a column command
Choose an action such as sorting or pinning and inspect how Product changes.
- Compare another column
Open the Quantity menu too. Available items can depend on column type and settings.
Run actions targeting the current column from its menu.
Columns with filtering disabled may need additional filter settings. Reset restores the example's initial column configuration.
Useful terms
- columnMenu
- A setting enabling header column menus.
- Column command
- An operation affecting a column's display, sorting, filtering, or related state.
Using this feature in your product requires the Pro runtime and a valid license.
API reference
#Key properties
| Attribute / Property | Type / Default | Description |
|---|---|---|
PRO columnMenu | booleanDefault: false | Grid Pro header menu: sort, filter, pin, visibility and keyboard navigation. |
Other properties1
| Attribute / Property | Type / Default | Description |
|---|---|---|
PRO columnMenuItems | (context: GridColumnMenuContext) => readonly GridColumnMenuItem[]Default: undefined | Appends custom commands to the built-in column menu. |
Explore each feature
Learn when to use each feature and how to configure it. Each guide identifies live examples and features you connect in your app.