All docs
V20.2
20.2
20.1
The page you are viewing does not exist in version 20.1. This link will take you to the root page.
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.
17.1
The page you are viewing does not exist in version 17.1. This link will take you to the root page.
16.2
The page you are viewing does not exist in version 16.2. This link will take you to the root page.
Box
Map
Vue

contextMenu

Configures the context menu settings.

Type:

Object

enabled

Specifies whether the context menu is enabled in the widget.

Type:

Boolean

Default Value: true

items[]

Configures context menu item settings.

Accepted Values: 'undo' | 'redo' | 'expandAll' | 'collapseAll' | 'addTask' | 'deleteTask' | 'zoomIn' | 'zoomOut' | 'deleteDependency' | 'taskDetails'

The context menu contains a set of default commands: 'addTask', 'taskDetails', and 'deleteTask'. Use the contextMenu option to recreate the context menu items.

DevExtreme Gantt - Default Context Menu

To add a predefined item to the context menu, add its name and optional settings (for example, 'visible', 'text', and 'icon') to the items collection.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({
        contextMenu: {
            items: [
                // Specify a predefined item's name only
                "expandAll",
                "redo",
                // Specify a predefined item's name and optional settings
                {
                    name: "zoomIn",
                    text: "Zooming"
                }
                //...
            ]
        }            
    });
});  

DevExtreme Gantt - Predefined Context Menu Items

Custom Items

To add a custom context menu item, specify its text and optional settings (for example, name or category). Use the customCommand event to handle clicks on custom context menu items.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({
        contextMenu: {
            items: [
                {
                    text: "Category",
                    items:[
                        {
                            text: "Item 1",
                            name: "item1"
                        },
                        {
                            text: "Item 2",
                            name: "item2"
                        },
                        {
                            text: "Item 3",
                            name: "item3"
                        }                        
                    ]                        
                }
                // ...
            ]
        }
        onCustomCommand: onCustomCommandClick
        // ...
    });
});
function onCustomCommandClick(args) {
    if(e.name == 'item1') {
        // your code
    }
}

DevExtreme Gantt - Custom Context Menu Items