How to ExcelExport with IncludeTemplateColumn from ContextMenu? Sample downloads the excel twice.

Following code downloads excel twice. 

How do I modify it, so that I can export templated columns from context menu?

   
   public async Task OnContextMenuClick(ContextMenuClickEventArgs args)
    {
        if (args.Item.Id.EndsWith("ExcelExport"))
        {
            ExcelExportProperties ExportProperties = new ExcelExportProperties();
            ExportProperties.IncludeTemplateColumn = true;
            await _grid!.ExportToExcelAsync(ExportProperties); //download excel, but does not prevent default action which downloads excel again
        }
    }

    <SfGrid @ref="_grid"  AllowExcelExport="true"

            ContextMenuItems="@(new List<object> { "ExcelExport" })">


3 Replies

PS Prathap Senthil Syncfusion Team April 30, 2024 11:33 AM UTC

Hi Liero

Based on the reported problem, we would like to inform you that when you enable the feature like this and define the grid ContextMenuItems="@(new List<object>() { "ExcelExport"})", it will perform the inbuilt operation. You are also externally doing the Excel export in the context menu event inside. Due to this, the exported file is downloaded twice.  Kindly refer to the documentation for the inbuilt features of context menu. To avoid this, we suggest defining a custom context menu item and then exporting the file. By following this approach, you can achieve your requirement. Kindly refer to the sample and documentation for your reference

 

<div class="component-container">

    <SfGrid ID="Grid" @ref="Grid" DataSource="@Orders"

            ContextMenuItems="@(new List<Object>() {new ContextMenuItemModel { Text = "ExcelExporttttt", Target = ".e-content", Id = "DataGridExcelExport" } })"

    AllowExcelExport="true" AllowPdfExport="true" >

    <GridEvents

        ContextMenuItemClicked="OnContextMenuClick"

        ExcelQueryCellInfoEvent = "ExcelQueryCellInfoHandler"

        TValue="Order"></GridEvents>   

    <GridColumns>

        <GridColumn Field="@nameof(Order.OrderID)" HeaderText="Order ID" Width="130"></GridColumn>

        <GridColumn Field="@nameof(Order.CustomerID)" HeaderText="Name" Width="130"></GridColumn>

        <GridColumn Field="@nameof(Order.Valid)" HeaderText="Valid" Width="150">

        <Template>

        @{

            @GetDomainMean((context as Order).Valid)

        }

        </Template>

        </GridColumn>       

    </GridColumns>

    </SfGrid>

</div>

 

@code{

    SfGrid<Order> Grid;

   

 

 

    public async Task OnContextMenuClick(Syncfusion.Blazor.Grids.ContextMenuClickEventArgs<Order> args)

    {

       

        if (args.Item.Id == "DataGridExcelExport")

        {

           

            ExcelExportProperties ExportProperties = new ExcelExportProperties();

            ExportProperties.IncludeTemplateColumn = true;

            await this.Grid.ExportToExcelAsync(ExportProperties);

        }

    }

 

 

}


Regards,
Prathap Senthil




LI Liero replied to Prathap Senthil April 30, 2024 02:03 PM UTC

But this breaks a lot of stuff :(


  1. Icon disappears
  2. Order of the context menu items changes if there is more
  3. Customized export is now toplevel, but CSV export is in submenu. Looks like shit.Image_7128_1714485692126

There really should be a way to prevent default functionality in  ContextMenuItemClicked  or another posibility to customize default functionality like ExcelExport in some callback




PS Prathap Senthil Syncfusion Team May 1, 2024 06:07 AM UTC


Based on your requirement, we have found a possible way to achieve the expected behavior using built-in context menu items along with custom context menu items. Kindly refer to the code snippet and sample below for your reference.


<SfGrid DataSource="@Orders" @ref="DefaultGrid" AllowSorting="true" AllowPaging="true" AllowExcelExport="true" AllowPdfExport="true" ContextMenuItems="@(new List<object>() { "Copy", "Edit", "Delete", "Save", "Cancel", new ContextMenuItemModel{ Text = "Export", Target = ".e-content", Id = "Export", Items = new List<MenuItem>() { new MenuItem { Text = "ExcelExport", Id = "DataGridExcelExport",IconCss = "e-icons e-excelexport" }, new MenuItem{ Text = "CSVexport", Id = "CSV", IconCss = "e-icons e-csvexport"}, new MenuItem{ Text="PDFExport", Id="PDF", IconCss="e-icons e-pdfexport" } }} })">

    <GridPageSettings PageSize="8"></GridPageSettings>

    <GridEvents ContextMenuItemClicked="OnContextMenuClick" TValue="Order"></GridEvents>

    <GridEditSettings AllowEditing="true" AllowDeleting="true"></GridEditSettings>

</SfGrid>

    public async Task OnContextMenuClick(ContextMenuClickEventArgs<Order> args)

    {

        if (args.Item.Id == "DataGridExcelExport")

        {

 

            ExcelExportProperties ExportProperties = new ExcelExportProperties();

 

            ExportProperties.IncludeTemplateColumn = true;

 

            await this.DefaultGrid.ExportToExcelAsync(ExportProperties);

 

        }

    }

 



Sample :
https://blazorplayground.syncfusion.com/embed/LNhJDStirCOZwsda?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

Reference:
https://blazor.syncfusion.com/documentation/datagrid/context-menu#built-in-and-custom-context-menu-items
https://blazor.syncfusion.com/documentation/datagrid/context-menu#sub-context-menu-items-in-datagrid


Loader.
Up arrow icon