React Data GridContextMenu
Description
This plugin creates the Handsontable Context Menu. It allows to create a new row or column at any place in the grid among other features. Possible values:
true
(to enable default options),false
(to disable completely){ uiContainer: containerDomElement }
(to declare a container for all of the Context Menu's dom elements to be placed in).- An array of the available strings
See the context menu demo for examples.
Example
// as a boolean
contextMenu: true
// as a array
contextMenu: ['row_above', 'row_below', '---------', 'undo', 'redo']
Options
contextMenu
Source codecontextMenu.contextMenu : boolean | Array<string> | object
The contextMenu
option configures the ContextMenu
plugin.
You can set the contextMenu
option to one of the following:
Setting | Description |
---|---|
false | Disable the ContextMenu plugin |
true | - Enable the ContextMenu plugin- Use the default context menu options |
An array | - Enable the ContextMenu plugin- Modify individual context menu options |
An object | - Enable the ContextMenu plugin- Apply a custom context menu configuration |
Read more:
- Context menu
- Context menu: Context menu with default options
- Context menu: Context menu with specific options
- Context menu: Context menu with fully custom configuration options
- Plugins:
ContextMenu
Default: undefined
Example
// enable the `ContextMenu` plugin
// use the default context menu options
contextMenu: true,
// enable the `ContextMenu` plugin
// and modify individual context menu options
contextMenu: ['row_above', 'row_below', '---------', 'undo', 'redo'],
// enable the `ContextMenu` plugin
// and apply a custom context menu configuration
contextMenu: {
items: {
'option1': {
name: 'Option 1'
},
'option2': {
name: 'Option 2',
submenu: {
items: [
{
key: 'option2:suboption1',
name: 'Suboption 1',
callback: function(key, options) {
...
}
},
...
]
}
}
}
},
Members
DEFAULT_ITEMS
Source codeContextMenu.DEFAULT_ITEMS ⇒ Array<string>
Context menu default items order when contextMenu
options is set as true
.
Methods
close
Source codecontextMenu.close()
Closes the menu.
destroy
Source codecontextMenu.destroy()
Destroys the plugin instance.
disablePlugin
Source codecontextMenu.disablePlugin()
Disables the plugin functionality for this Handsontable instance.
enablePlugin
Source codecontextMenu.enablePlugin()
Enables the plugin functionality for this Handsontable instance.
executeCommand
Source codecontextMenu.executeCommand(commandName, ...params)
Execute context menu command.
The executeCommand()
method works only for selected cells.
When no cells are selected, executeCommand()
doesn't do anything.
You can execute all predefined commands:
'row_above'
- Insert row above'row_below'
- Insert row below'col_left'
- Insert column left'col_right'
- Insert column right'clear_column'
- Clear selected column'remove_row'
- Remove row'remove_col'
- Remove column'undo'
- Undo last action'redo'
- Redo last action'make_read_only'
- Make cell read only'alignment:left'
- Alignment to the left'alignment:top'
- Alignment to the top'alignment:right'
- Alignment to the right'alignment:bottom'
- Alignment to the bottom'alignment:middle'
- Alignment to the middle'alignment:center'
- Alignment to the center (justify).
Or you can execute command registered in settings where key
is your command name.
Param | Type | Description |
---|---|---|
commandName | string | The command name to be executed. |
...params | * | Additional parameters passed to command executor module. |
isEnabled
Source codecontextMenu.isEnabled() ⇒ boolean
Checks if the plugin is enabled in the handsontable settings. This method is executed in Hooks#beforeInit
hook and if it returns true
then the ContextMenu#enablePlugin method is called.
open
Source codecontextMenu.open(position, offset)
Opens menu and re-position it based on the passed coordinates.
Emits: Hooks#event:beforeContextMenuShow
, Hooks#event:afterContextMenuShow
Param | Type | Description |
---|---|---|
position | Object Event | An object with top and left properties which contains coordinates relative to the browsers viewport (without included scroll offsets). Or if the native event is passed the menu will be positioned based on the pageX and pageY coordinates. |
offset | Object | An object allows applying the offset to the menu position. |
updatePlugin
Source codecontextMenu.updatePlugin()
Updates the plugin's state.
This method is executed when updateSettings()
is invoked with any of the following configuration options: