Skip to main content
All docs
V25.1
  • ASPxClientGantt.ContextMenuCustomization Event

    Occurs before the built-in context menu is rendered.

    Declaration

    ContextMenuCustomization: ASPxClientEvent<ASPxClientGanttContextMenuCustomizationEventHandler<ASPxClientGantt>>

    Event Data

    The ContextMenuCustomization event's data class is ASPxClientGanttContextMenuCustomizationEventArgs. The following properties provide information specific to this event:

    Property Description
    cancel Specifies whether to cancel the related action (for example, row edit, export). Inherited from ASPxClientCancelEventArgs.
    menuItems Gets the collection of context menu items.

    Remarks

    The built-in context menu contains a set of default items:

    • Add a task/subtask.

    • Open the edit dialog.

    • Delete a task.

    Gantt - Built-in Context Menu

    Use the menuItems property to access and manage the collection of items. To remove predefined items from the context menu, call the Clear method.

    To create a custom context menu, set the ContextMenuCustomization event’s e.cancel parameter to true and handle the ContextMenu event.

    Run Demo: ASPxGantt - Context Menu Run Demo: MVCxGantt - Context Menu

    Add a Context Menu Item

    Create a ASPxClientGanttContextMenuItem object, specify its text and name properties, and add this object to the following collections:

    • menuItems - Gets the collection of regular context menu items.

    • GetSubItems - Gets the collection of an item’s subitems.

    Use the CustomCommand event to handle clicks on custom items.

    Web Forms:

    <dx:ASPxGantt ID="Gantt" >
        //...
        <ClientSideEvents
          ContextMenuCustomization="function(s, e) {
              ...
              // Creates an item
              var customItem = new ASPxClientGanttContextMenuItem();
              customItem.name = 'Item1';
              customItem.text = 'Item1';
              customItem.beginGroup = true;
    
              // Adds the item to the context menu items
              e.menuItems.Add(customItem);
    
              // Creates a subitem
              var customSubItem = new ASPxClientGanttContextMenuItem();
              customSubItem.name = 'Subitem1';
              customSubItem.text = 'Subitem1';
    
              // Adds the subitem to the parent item.
              customItem.GetSubItems().Add(customSubItem);
          }
          CustomCommand="function(s, e) {
              // Handles an item click
              if(e.commandName == 'Item1') {
                  // your code
              }
          }
        />
    </dx:ASPxGantt>
    

    MVC:

    @Html.DevExpress().Gantt(settings => {
        settings.Name = "gantt";
        settings.ClientSideEvents.ContextMenuCustomization = "function (s, e) { 
            // Creates an item
            var customItem = new ASPxClientGanttContextMenuItem();
            customItem.name = 'Item1';
            customItem.text = 'Item1';
            customItem.beginGroup = true;
    
            // Adds the item to the context menu items
            e.menuItems.Add(customItem);
    
            // Creates a subitem
            var customSubItem = new ASPxClientGanttContextMenuItem();
            customSubItem.name = 'Subitem1';
            customSubItem.text = 'Subitem1';
    
            // Adds the subitem to the parent item.
            customItem.GetSubItems().Add(customSubItem);        
        }";
    
        settings.ClientSideEvents.CustomCommand = "function (s, e) { 
            // Handles an item click
            if(e.commandName == 'Item1') {
                // your code
            }        
        }";
        ...
    }).Bind(
        GanttDataProvider.Tasks, GanttDataProvider.Dependencies, 
        GanttDataProvider.Resources, GanttDataProvider.ResourceAssignments
    ).GetHtml()
    
    See Also