Componente ContextMenu — sgcHTML | eSeGeCe

ContextMenu

TsgcHTMLComponent_ContextMenu — renderize um menu suspenso Bootstrap acionado pelo clique direito, restrito a um seletor CSS, com ícones, divisores, cabeçalhos e ações roteadas pelo servidor, em Delphi, C++ Builder e .NET.

Visão geral

TsgcHTMLComponent_ContextMenu

Adicione entradas a Items, restrinja os cliques direitos com TargetSelector, e então leia a propriedade HTML; um clique direito posiciona e abre o menu.

Classe do componente

TsgcHTMLComponent_ContextMenu

Renderiza

<ul> dropdown-menu do Bootstrap 5 + script de vinculação

Família

Overlays & Feedback

Linguagens

Delphi, C++ Builder, .NET

QuickStart

Adicione entradas, restrinja o alvo, renderize

Chame Items.Add para cada entrada e defina seu Caption/Icon/DataAction (ou Href), restrinja os cliques direitos com TargetSelector, e então leia 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

Referência

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Items

Items contém as entradas, cada uma um TsgcHTMLContextMenuItem com Caption, Icon, Href, DataAction, Divider, Header e Disabled.

Items.Add

Items.Add adiciona uma entrada à coleção e a retorna para que você possa definir suas propriedades.

TargetSelector

Restringe a captura do clique direito aos elementos que correspondem a este seletor CSS; se vazio, todo clique direito na página abre o menu.

DataAction

Clicar em uma entrada com DataAction a envia através de window.sgcHTMX.send (o mesmo canal usado pelos formulários) e dispara um evento DOM sgcContextMenu:action.

Divider & Header

Divider renderiza uma linha separadora; Header renderiza um título de seção não clicável em vez de um link.

MenuID

Define explicitamente o id do elemento do menu; se vazio, um id único é gerado e armazenado em cache automaticamente.

Recursos

Continue explorando

	Ajuda onlineReferência completa da API e guia de uso para este componente.	Abrir
	Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 80 componentes.	Abrir
	Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML.	Abrir
	PreçosLicenças Single, Team e Site com código-fonte completo.	Abrir