.net - Context Menu won't close after BlazoredPopup is open from the context menu - Stack Overflow

I have this code that shows a BlazoredModal. The context Menu shows above the Modal instead of disappearing. It does disappear for the "Delete" and "ViewDetails" options.

    // Example context menu
private Task OnContextMenuOpen(ContextMenuOpenEventArgs<ExpandoObject> args) => Task.CompletedTask;

                    private async Task OnContextMenuItemClicked(ContextMenuClickEventArgs<ExpandoObject> args)
                {
                    if (args.RowInfo?.RowData is ExpandoObject rowData && args.Item.Text == "Edit")
                    {
                        Console.WriteLine("Edit action triggered.");
                        // Introduce a slight delay to allow the grid's context menu to close
                        // await Task.Delay(1000);
                        // Open the modal with the selected row data
                        var parameters = new ModalParameters();
                        parameters.Add("SelectedItem", rowData);
                        var result = await ModalService.Show<EditRowModal>("Edit Row", parameters).Result;
                    }
                    else if (args.Item.Text == "Delete")
                    {
                        Console.WriteLine("Delete action triggered.");
                        // Implement delete logic here

                    }
                    else if (args.Item.Text == "View Details")
                    {
                        Console.WriteLine("View Details action triggered.");
                        // Implement view details logic here

                    }
                

    private List<ContextMenuItemModel> _contextMenuItems = new()
    {
    new ContextMenuItemModel { Text = "Edit", IconCss = "e-icons e-edit", Id = "edit" },
    new ContextMenuItemModel { Text = "Delete", IconCss = "e-icons e-delete", Id = "delete" },
    new ContextMenuItemModel { Text = "View Details", IconCss = "e-icons e-eye", Id = "viewDetails" }
    };


            <SfGrid @ref="_gridRef" DataSource="@Items"
        AllowPaging="true"
        AllowSorting="true"
        AllowFiltering="true"
        AllowReordering="true"
        AllowResizing="true"
        GridLines="GridLine.Horizontal"
        ContextMenuItems="@_contextMenuItems"
        EnableStickyHeader="true">

The Modal/popup in fact opens after Edit is clicked (which is desired); but the context menu is supposed to be closed after that.

I have this code that shows a BlazoredModal. The context Menu shows above the Modal instead of disappearing. It does disappear for the "Delete" and "ViewDetails" options.

    // Example context menu
private Task OnContextMenuOpen(ContextMenuOpenEventArgs<ExpandoObject> args) => Task.CompletedTask;

                    private async Task OnContextMenuItemClicked(ContextMenuClickEventArgs<ExpandoObject> args)
                {
                    if (args.RowInfo?.RowData is ExpandoObject rowData && args.Item.Text == "Edit")
                    {
                        Console.WriteLine("Edit action triggered.");
                        // Introduce a slight delay to allow the grid's context menu to close
                        // await Task.Delay(1000);
                        // Open the modal with the selected row data
                        var parameters = new ModalParameters();
                        parameters.Add("SelectedItem", rowData);
                        var result = await ModalService.Show<EditRowModal>("Edit Row", parameters).Result;
                    }
                    else if (args.Item.Text == "Delete")
                    {
                        Console.WriteLine("Delete action triggered.");
                        // Implement delete logic here

                    }
                    else if (args.Item.Text == "View Details")
                    {
                        Console.WriteLine("View Details action triggered.");
                        // Implement view details logic here

                    }
                

    private List<ContextMenuItemModel> _contextMenuItems = new()
    {
    new ContextMenuItemModel { Text = "Edit", IconCss = "e-icons e-edit", Id = "edit" },
    new ContextMenuItemModel { Text = "Delete", IconCss = "e-icons e-delete", Id = "delete" },
    new ContextMenuItemModel { Text = "View Details", IconCss = "e-icons e-eye", Id = "viewDetails" }
    };


            <SfGrid @ref="_gridRef" DataSource="@Items"
        AllowPaging="true"
        AllowSorting="true"
        AllowFiltering="true"
        AllowReordering="true"
        AllowResizing="true"
        GridLines="GridLine.Horizontal"
        ContextMenuItems="@_contextMenuItems"
        EnableStickyHeader="true">

The Modal/popup in fact opens after Edit is clicked (which is desired); but the context menu is supposed to be closed after that.

• .net
• asp.net-core
• blazored
• syncfusion-blazor
• sfdatagrid

Share Follow edited Feb 24 at 13:01 who-aditya-nawandar asked Feb 2 at 5:19 who-aditya-nawandarwho-aditya-nawandar 1,2441111 gold badges5050 silver badges105105 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

You could use async void instead of async Task which doesn't return "Task" for the method result.

private async void OnContextMenuItemClicked (..)

Or if you need the "Task", you could try close the context manually:

<SfContextMenu @ref="contextMenuRef" TValue="MenuItem" ...>
@code {
    SfContextMenu<MenuItem> contextMenuRef;
    private async Task OnContextMenuItemClicked(ContextMenuClickEventArgs<ExpandoObject> args){
        ...
        contextMenuRef.Close();
        var result = await ModalService.Show<EditRowModal>("Edit Row", parameters).Result;
    }