Example of Column Menu in ASP.NET MVC Data Grid Control

This sample demonstrates the default functionalities of the ColumnMenu. Click the icon of each column to open the column menu.

DEMO
SOURCE
Column Menu

The grid provides an option to display a column menu when the user clicks the icon on each column. This menu includes integrated features like sorting, grouping, filtering, column chooser, and auto-fitting. These features can be enabled by setting the showColumnMenu property to `true`. The default menu items include:

  • SortAscending: Sort the current column in ascending order.
  • SortDescending: Sort the current column in descending order.
  • Group: Group the current column.
  • Ungroup: Ungroup the current column.
  • AutoFit: Auto-fit current column.
  • AutoFitAll: Auto-fit all columns.
  • ColumnChooser: Toggle column visibility.
  • Filter: Display the filter option as specified in the filterSetting->type.

The default column menu items are enabled based on the corresponding feature settings. Additionally, the column menu allows users to include custom menu items with the default ones, or the replacement of the default items entirely with custom options.

In this demo, the Column Menu feature is initially enabled by setting showColumnMenu to `true`, with sorting, grouping, filtering, column chooser, and auto-fit options. Users also have the option to toggle custom column menu items through using the dropdown list in the property panel. In the custom menu, sorting, grouping, and filtering are enabled, and custom options like column selection and clear selection have been added.

Transform your ASP.NET MVC web apps today with Syncfusion ASP.NET MVC components
85+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE
opens in a new tab