Ag-grid context menu icon

Question

Is it possible to add custom HTML elements to an icon to an Ag-grid context menu item? The following doesnt render any icon:

 getContextMenuItems = (params) => [
    {
      name: 'Cancel items',
      action: this.onCancelLocates(),
      icon:  <span><Icon name="cancel" size="small" /></span>
    },
    'separator',
    'copy',
    'copyWithHeaders',
    'paste',
    'separator',
    'export'
  ]

Does this answer your question? [Unable to execute function in Context Menu](https://stackoverflow.com/questions/56838691/unable-to-execute-function-in-context-menu) — NicuVlad, Dec 16 '20 at 10:05
That link also did not work, may be because of not having appropriate framework css import. — MindRoasterMir, Jun 28 '21 at 11:22

score 1 · Answer 1 · answered Jun 28 '21 at 11:25

This is how you can add custome icons

 getContextMenuItems = (params) => [
{
  name: 'Cancel items',
  action: this.onCancelLocates(),
  icon:  '<span class="ag-icon ag-icon-save" unselectable="on" role="presentation"></span>'
},
'separator',
'copy',
'copyWithHeaders',
'paste',
'separator',
'export'  ]

You can get this span code from right clicking the already present icons inside the context menu. Thanks

Ag-grid context menu icon

1 Answers1