How can I disable right click/context menu for ag-grid?

12,856

Solution 1

suppressContextMenu:true for gridOptions

Will work

Solution 2

[suppressContextMenu]="true" would do your ask.

Alternatively, if you are defining getContextMenuItems in your component, simply return empty array from the function.

this.getContextMenuItems = function getContextMenuItems(params) {
  return [];
};
<ag-grid-angular
    #agGrid
    .........
    [getContextMenuItems]="getContextMenuItems"   // provide the function here
    (gridReady)="onGridReady($event)"
    ></ag-grid-angular>

Have a look at this plunk I've created

You can also conditionally decide if you don't want it for any specific column or not using the arguments params.

Share:
12,856
TerribleDeveloper
Author by

TerribleDeveloper

Dear Mr./Ms./M/s This letter is to express my interest in the job posted on your website for an experienced, detailed-oriented, front-end web developer. As you'll see, I have five years of hands-on experience efficiently coding websites and applications using modern HTML, CSS, JavaScript, React JS, Angular and Node JS Building state-of-the-art, easy to use, user-friendly websites and applications is truly a passion of mine and I am confident I would be an excellent addition to your organization. In addition to my knowledge base, I actively seek out new technologies and stay up-to-date on industry trends and advancements. This has allowed me to stay ahead of the curve and deliver exceptional work to all of my employers, including those I've worked for on a project basis. I’ve attached a copy of my resume detailing my experience, along with links to websites and applications I’ve had the honor of working on. I can be reached anytime via my cell phone, +91 - 784-253-7955 or by email at [email protected]. Thank you for your time and consideration. I look forward to speaking with you about this opportunity. Best regards Pratik Nagpure

Updated on June 15, 2022

Comments

  • TerribleDeveloper
    TerribleDeveloper about 2 years

    I am using ag-grid enterprise version and I want to disable context menu or a right click on the grid cells but I did not found any solution.

    Here is my code

    <ag-grid-angular #agGrid style="width: 100%; height: 100%;" id="myGrid" 
    [rowData]="rowData" class="ag-theme-balham" [columnDefs]="columnDefs" 
    [enableRangeSelection]="true" (gridReady)="onGridReady($event)"></ag-grid- 
    angular>
    

    enter image description here

  • TerribleDeveloper
    TerribleDeveloper over 5 years
    Thanks. But adding [suppressContextMenu]="true" looks a simple solution
  • Angela P
    Angela P over 4 years
    I tried both suppressContextMenu = true and the above approach. And they are surprisingly not the same result. I'm trying to suppress Context Menu on 1 column specifically because it contains URL/links, so I implemented getContextMenu() and checked for only when user click on that particular column, to return [ ] or null. right click doesn't bring up the browser default menu to "open link in new tab." however the suppressContextMenu= true solution, it does achieve the right click bring up browser default. But All columns are effected in this case.
  • Paritosh
    Paritosh over 4 years
    that's why I provided the answer for getContextMenuItems. Keeping [suppressContextMenu]="true" would suppress context menu for all the columns
  • Himanshu Rawat
    Himanshu Rawat over 2 years
    Empty array is working for me but showing error UserFunc is not a function what should I do. I have to context menu items for columns but as soon as pivot or change tab in aggrid. I have to hide.