1. Home
  2. Forum
  3. Blazor
  4. TreeGrid - Custom context menu menuitem event

TreeGrid - Custom context menu menuitem event

It's not clear from the documentation how to set up up and capture an OnContextMenuClick event for a custom menu item - there isn't such a property for the <TreeGridEvents> object either. Anyone know how to set this up?

5 Replies 1 reply marked as answer
MP Manivannan Padmanaban Syncfusion Team June 26, 2020 09:36 AM UTC

Hi Marshall, 

Greetings from Syncfusion Support. 

Query: TreeGrid - Custom context menu menuitem event 

From the shared query, we are able to understand that you want to use custom context menu. To achieve your requirement, we suggest you to refer the below code example. 

@using Syncfusion.Blazor.Grids 
@using Syncfusion.Blazor.TreeGrid; 
@using Syncfusion.Blazor.Navigations; 
  
<SfTreeGrid DataSource="@TreeData" @ref="TreeGrid" …. ContextMenuItems="@(new List<ContextMenuItemModel>() { new ContextMenuItemModel { Text = "Copy with headers", Target = ".e-content", Id = "copywithheader" } })" TreeColumnIndex="1"> 
    <TreeGridEvents ContextMenuItemClicked="OnContextMenuClick" TValue="BusinessObject"></TreeGridEvents> 
    <TreeGridColumns> 
        ………….. 
    </TreeGridColumns> 
</SfTreeGrid> 
  
@code{ 
    SfTreeGrid<BusinessObject> TreeGrid; 
  
    ………………. 
  
    protected override void OnInitialized() 
    { 
 ……………….. 
    } 
  
    public void OnContextMenuClick(MenuEventArgs args) 
    { 
        if (args.Item.Id == "copywithheader") 
        { 
            this.TreeGrid.Copy(true); 
        } 
    } 
  
} 


 

Also, we will add the context menu section in our Blazor Tree Grid UG documentation and the same will be refreshed online in any of our upcoming releases. 

Regards, 
Manivannan Padmanaban 


Marked as answer
MA Marshall June 26, 2020 10:15 AM UTC

 Hi Manivannan,

Thank you for your response.

I followed your instructions without difficulty but receive "syncfusion-blazor.min.js:1 memory access out of bounds" error (see attached console log) after selecting the custom menu item, so the OnContextMenuClick callback never occurs. I even removed the this.TreeGrid.Copy(true); line in case that was the issue.

Regards,
Marshall

Attachment: localhost1593165921563_c9f19367.zip

MP Manivannan Padmanaban Syncfusion Team June 29, 2020 11:53 AM UTC

Hi Marshall, 

We are unable to reproduce the reported issue at our end. For your convenience we have created the sample, refer to the below link. 

After referred the sample still facing an issue, please get back to us with the below details. 
  1. Share the Visual Studio 2019 Version and dotnet core version details.
  2. Confirm whether are you received the exception in the initial rendering Or while performing any specific action.
  3. If possible reproduce the issue in the shared sample Or share the issue reproducible sample.

Regards, 
Manivannan Padmanaban 


FE Felipe July 23, 2020 08:01 PM UTC

This example work only with Syncfusion.Blazor" Version="18.1.0.59. I´ve tried to 18.2 and doesn´t work anymore

PS Pon Selva Jeganathan Syncfusion Team July 24, 2020 01:03 PM UTC

Hi Felipe, 

Thanks for contacting Syncfusion Forums. 

Query:-  Custom context menu menuitem event 

We have some breaking changes in our volume 2 2020(V18.2.44) main release. Kindly refer to the below link for further details. 

In context menu click event, we suggest you to use the ContextMenuClickEventArgs instead of MenuEventArgs. Refer to the below code example, 

@using Syncfusion.Blazor.Grids  
@using Syncfusion.Blazor.TreeGrid;  
   
<SfTreeGrid DataSource="@TreeData" @ref="TreeGrid" …. ContextMenuItems="@(new List<ContextMenuItemModel>() { new ContextMenuItemModel { Text = "Copy with headers", Target = ".e-content", Id = "copywithheader" } })" TreeColumnIndex="1">  
    <TreeGridEvents ContextMenuItemClicked="OnContextMenuClick" TValue="BusinessObject"></TreeGridEvents>  
    <TreeGridColumns>  
        …………..  
    </TreeGridColumns>  
</SfTreeGrid>  
   
@code{  
    SfTreeGrid<BusinessObject> TreeGrid;  
   
    ……………….  
   
    protected override void OnInitialized()  
    {  
 ………………..  
    }  
   
    public void OnContextMenuClick(ContextMenuClickEventArgs< BusinessObject > args)  
    {  
        if (args.Item.Id == "copywithheader")  
        {  
            this.TreeGrid.Copy(true);  
        }  
    }  
   
}  
 
 
Please refer the attached sample, 
 
Refer to the help documentation Link:- 

Please get back to us if you need any further assistance on it. 

Regards, 
Pon selva 


Loader.
Up arrow icon