customizeContextMenu(customizeFunction: Function)
[starting from version: 2.6]
This API call allows customizing the context menu. For example, you can create a context menu for a flat table or remove all context menu items for the classic view. Learn more in this guide: Customizing the context menu.
customizeContextMenu
can be defined in two ways:
flexmonster.customizeContextMenu(customizeFunction: Function)
.new Flexmonster({customizeContextMenu: customizeFunction, ...})
.customizeFunction
– Function. It has the following signature: customizeFunction(items: Array, data: CellDataObject | ChartDataObject, viewType: String): Array
.customizeFunction
:items
– Array of objects. Context menu items created by Flexmonster. Each object can have the following properties: id
– String. The ID of the menu item.label
– String. The name of the menu item.handler
– Function. The function that handles clicks on this item.submenu
optional – Array of objects. Contains submenu items. Each submenu item has the same structure as items
.isSelected
optional – Boolean. Specifies whether the menu item is selected.class
optional – String. Adds a custom CSS class to the specified item. data
– CellDataObject | ChartDataObject. Information about the right-clicked object. In the case of right-clicking on the grid, this is a CellDataObject containing information about the cell. In the case of right-clicking on the chart element, this is a ChartDataObject containing information about the chart segment.viewType
– String. View type that was right-clicked. Can have one of the four possible values: "pivot"
– Means that the pivot grid was right-clicked, either compact or classic view."flat"
– Means that the flat table view was right-clicked."charts"
– Means that the chart view was right-clicked."drillthrough"
– Means that drill through view was right-clicked. customizeFunction
must return items
, the array of new or changed context menu items. If items
is null
, the default items
will be used. If items
is []
, the context menu will be hidden.1) Add a “Switch to charts” option to the flat table context menu:
flexmonster.customizeContextMenu(function(items, data, viewType) { if (viewType == "flat") items.push({ label: "Switch to charts", handler: function() { flexmonster.showCharts(); } }); return items; });
Open the example on JSFiddle.
2) Remove “Aggregation” item from all the context menus:
flexmonster.customizeContextMenu(function(items, data, viewType) { items = items.filter(function (item){ return item.label !== "Aggregation" }) return items; });
Open the example on JSFiddle.
Customizing the context menu
customizeCell()
customizeChartElement()