How to customize the column menu items of Blazor SfGrid?

[Syncfusion Support]

Answer:

You can customize the default menu items by defining the ColumnMenuItems with the required items. To enable column menu, you need to define the ShowColumnMenu property as true.

@using Syncfusion.Blazor.Grids

<div style="height:700px">

<SfGrid ID="Grid" @ref="Grid" DataSource="@Orders" AllowReordering="true" AllowResizing="true" ShowColumnChooser="true"

ColumnMenuItems="@MenuItems" AllowSelection="true" AllowPaging="true" AllowSorting="true" AllowFiltering="true"

AllowGrouping="true" AllowExcelExport="true" AllowPdfExport="true" AllowTextWrap="false" Height="100%"

Toolbar="@(new List<string>() { "ExcelExport", "CsvExport", "PdfExport","Print","Search" ,"ColumnChooser"})"

ContextMenuItems="@(new List<object>() { "AutoFit", "AutoFitAll", "SortAscending", "SortDescending","Copy","PdfExport", "ExcelExport", "CsvExport", "FirstPage", "PrevPage","LastPage", "NextPage"})"

ShowColumnMenu="true">

<GridFilterSettings Type="@Syncfusion.Blazor.Grids.FilterType.CheckBox">GridFilterSettings>

. . .

SfGrid>

div>

@code{

SfGrid Grid;

public string[] MenuItems = new string[] { "Group", "Ungroup", "ColumnChooser", "Filter" };

public List Orders { get; set; }

. ..

}

Reference: https://blazor.syncfusion.com/documentation/datagrid/columns/#column-menu