Modal
TsgcHTMLComponent_Modal — Delphi, C++ Builder 및 .NET에서 제목, 본문, 푸터 버튼, 크기 조정 및 가운데 정렬 또는 정적 배경을 갖춘 Bootstrap 5 모달 대화 상자를 렌더링합니다.
TsgcHTMLComponent_Modal — Delphi, C++ Builder 및 .NET에서 제목, 본문, 푸터 버튼, 크기 조정 및 가운데 정렬 또는 정적 배경을 갖춘 Bootstrap 5 모달 대화 상자를 렌더링합니다.
Bootstrap 5 modal 마크업을 내보내는 모달 대화 상자 컴포넌트입니다. 제목, 본문 및 크기를 설정하고, 푸터 버튼을 추가한 다음, HTML 속성을 읽습니다 — 또는 한 줄짜리 정적 Build 헬퍼를 호출하십시오.
빠른 모달을 위해 Build(id, title, body, footer, size)를 호출하거나, 컴포넌트를 생성하고 AddFooterButton으로 푸터 버튼을 추가한 다음, HTML을 읽습니다. 대화 상자를 열려면 BuildTriggerButton과 함께 사용하십시오.
uses
sgcHTML_Enums, sgcHTML_Component_Modal;
// One-line static helper (primary form):
var
vTrigger, vDialog: string;
begin
vTrigger := TsgcHTMLComponent_Modal.BuildTriggerButton('confirmModal',
'Delete account', bsDanger);
vDialog := TsgcHTMLComponent_Modal.Build('confirmModal',
'Please confirm', 'This action cannot be undone.',
'', msDefault);
WebModule.Response := vTrigger + vDialog;
end;
// Or configure it fully and add custom footer buttons:
var
oModal: TsgcHTMLComponent_Modal;
begin
oModal := TsgcHTMLComponent_Modal.Create(nil);
try
oModal.ModalID := 'confirmModal';
oModal.Title := 'Please confirm';
oModal.Body := 'This action cannot be undone.';
oModal.Size := msLarge;
oModal.Centered := True;
oModal.StaticBackdrop := True;
oModal.AddFooterButton('Cancel', bsSecondary, True);
oModal.AddFooterButton('Delete', bsDanger);
WebModule.Response := oModal.HTML; // Bootstrap modal markup
finally
oModal.Free;
end;
end;// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Modal.hpp
// One-line static helper (primary form):
String trigger = TsgcHTMLComponent_Modal::BuildTriggerButton("confirmModal",
"Delete account", bsDanger);
String dialog = TsgcHTMLComponent_Modal::Build("confirmModal",
"Please confirm", "This action cannot be undone.",
"", msDefault);
// Or configure it fully and add custom footer buttons:
TsgcHTMLComponent_Modal *oModal = new TsgcHTMLComponent_Modal(NULL);
try
{
oModal->ModalID = "confirmModal";
oModal->Title = "Please confirm";
oModal->Body = "This action cannot be undone.";
oModal->Size = msLarge;
oModal->Centered = true;
oModal->StaticBackdrop = true;
oModal->AddFooterButton("Cancel", bsSecondary, true);
oModal->AddFooterButton("Delete", bsDanger);
String html = oModal->HTML; // Bootstrap modal markup
}
__finally
{
delete oModal;
}using esegece.sgcWebSockets;
// One-line static helper (primary form):
string trigger = TsgcHTMLComponent_Modal.BuildTriggerButton("confirmModal",
"Delete account", TsgcHTMLButtonStyle.bsDanger);
string dialog = TsgcHTMLComponent_Modal.Build("confirmModal",
"Please confirm", "This action cannot be undone.",
"", TsgcHTMLModalSize.msDefault);
// Or configure it fully and add custom footer buttons:
var modal = new TsgcHTMLComponent_Modal();
modal.ModalID = "confirmModal";
modal.Title = "Please confirm";
modal.Body = "This action cannot be undone.";
modal.Size = TsgcHTMLModalSize.msLarge;
modal.Centered = true;
modal.StaticBackdrop = true;
modal.AddFooterButton("Cancel", TsgcHTMLButtonStyle.bsSecondary, true);
modal.AddFooterButton("Delete", TsgcHTMLButtonStyle.bsDanger);
string html = modal.HTML; // Bootstrap modal markup가장 자주 사용하게 되는 멤버.
Title은 헤더를 설정하고, Body는 대화 상자 콘텐츠를 담으며, Footer는 원시 푸터 HTML을 받습니다. ModalID는 트리거가 사용하는 요소 id입니다.
AddFooterButton(text, style, closeOnClick)는 스타일이 적용된 버튼을 추가합니다. 클릭 시 모달을 닫으려면 closeOnClick에 True를 전달하십시오.
Size는 TsgcHTMLModalSize를 통해 msDefault, msSmall, msLarge, msXLarge 또는 msFullscreen을 선택합니다.
Centered는 대화 상자를 세로로 가운데 정렬하고, Scrollable은 긴 본문을 스크롤하며, StaticBackdrop은 외부 클릭으로 닫기를 차단하고, ShowClose는 헤더 X를 토글합니다.
Build(id, title, body, footer, size)는 준비된 모달을 반환합니다. BuildTriggerButton(modalID, text, style)은 이를 여는 버튼을 내보냅니다.
HTML은 완전한 Bootstrap 모달 마크업을 반환합니다 — 제공하거나, 페이지 템플릿의 BodyContent에 할당하십시오.