ContextMenu

TsgcHTMLComponent_ContextMenu — render a right-click Bootstrap dropdown menu scoped to a CSS selector, with icons, dividers, headers and server-routed actions, in Delphi, C++ Builder and .NET.

At a glance

TsgcHTMLComponent_ContextMenu

Add entries to Items, scope right-clicks with TargetSelector, then read the HTML property; a right click positions and opens the menu.

Component class

TsgcHTMLComponent_ContextMenu

Renders

Bootstrap 5 dropdown-menu <ul> + binding script

Family

Overlays & Feedback

Languages

Delphi, C++ Builder, .NET

QuickStart

Add entries, scope the target, render it

Call Items.Add for each entry and set its Caption/Icon/DataAction (or Href), restrict right-clicks with TargetSelector, then read HTML.

uses
  sgcHTML_Component_ContextMenu;

var
  oMenu: TsgcHTMLComponent_ContextMenu;
  oItem: TsgcHTMLContextMenuItem;
begin
  oMenu := TsgcHTMLComponent_ContextMenu.Create(nil);
  try
    oMenu.MenuID := 'grid_menu';
    oMenu.TargetSelector := '.grid-row';

    oItem := oMenu.Items.Add;
    oItem.Caption := 'Edit';
    oItem.Icon := 'bi bi-pencil';
    oItem.DataAction := 'row:edit';

    oItem := oMenu.Items.Add;
    oItem.Caption := 'Delete';
    oItem.Icon := 'bi bi-trash';
    oItem.DataAction := 'row:delete';

    oItem := oMenu.Items.Add;
    oItem.Divider := True;

    oItem := oMenu.Items.Add;
    oItem.Caption := 'Open in new tab';
    oItem.Href := '/grid/open';

    WebModule.Response := oMenu.HTML;   // hidden <ul> + right-click binding script
  finally
    oMenu.Free;
  end;
end;

// includes: sgcHTML_Component_ContextMenu.hpp

TsgcHTMLComponent_ContextMenu *oMenu = new TsgcHTMLComponent_ContextMenu(NULL);
try
{
  oMenu->MenuID = "grid_menu";
  oMenu->TargetSelector = ".grid-row";

  TsgcHTMLContextMenuItem *oItem = oMenu->Items->Add();
  oItem->Caption = "Edit";
  oItem->Icon = "bi bi-pencil";
  oItem->DataAction = "row:edit";

  oItem = oMenu->Items->Add();
  oItem->Caption = "Delete";
  oItem->Icon = "bi bi-trash";
  oItem->DataAction = "row:delete";

  oItem = oMenu->Items->Add();
  oItem->Divider = true;

  String html = oMenu->HTML;   // hidden <ul> + right-click binding script
}
__finally
{
  delete oMenu;
}

using esegece.sgcWebSockets;

var menu = new TsgcHTMLComponent_ContextMenu();
menu.MenuID = "grid_menu";
menu.TargetSelector = ".grid-row";

var item = menu.Items.Add();
item.Caption = "Edit";
item.Icon = "bi bi-pencil";
item.DataAction = "row:edit";

item = menu.Items.Add();
item.Caption = "Delete";
item.Icon = "bi bi-trash";
item.DataAction = "row:delete";

item = menu.Items.Add();
item.Divider = true;

string html = menu.HTML;   // hidden <ul> + right-click binding script

Reference

Key properties & methods

The members you reach for most often.

Items

Items holds the entries, each a TsgcHTMLContextMenuItem with Caption, Icon, Href, DataAction, Divider, Header and Disabled.

Items.Add

Items.Add appends an entry to the collection and returns it so you can set its properties.

TargetSelector

Restricts the right-click capture to elements matching this CSS selector; left empty, every right click on the page opens the menu.

DataAction

Clicking an entry with a DataAction sends it through window.sgcHTMX.send (the same channel forms use) and fires a sgcContextMenu:action DOM event.

Divider & Header

Divider renders a separator line; Header renders a non-clickable section title instead of a link.

MenuID

Sets the menu's element id explicitly; left empty, a unique id is generated and cached automatically.

Resources

Keep exploring

	Online HelpFull API reference and usage guide for this component.	Open
	All sgcHTML ComponentsBrowse the full feature matrix of 80+ components.	Open
	Download Free TrialThe 30-day trial ships the 60.HTML demo projects.	Open
	PricingSingle, Team and Site licenses with full source code.	Open

Last updated: 16 July 2026