RichEditor

TsgcHTMLComponent_RichEditor — erzeugen Sie einen Quill-basierten WYSIWYG-Rich-Text-Editor mit einem verborgenen Input, das sein HTML für das Absenden von Formularen synchronisiert, in Delphi, C++ Builder und .NET.

Auf einen Blick

TsgcHTMLComponent_RichEditor

Eine Editor-Komponente, die ein Quill-Editor-Div, dessen CDN-Assets und ein Init-Skript ausgibt, plus ein verborgenes Input, das den Inhalt bei jeder Änderung spiegelt. Setzen Sie Inhalt und Toolbar und lesen Sie dann die HTML-Eigenschaft.

Komponentenklasse

TsgcHTMLComponent_RichEditor

Rendert

Quill-Editor + verborgenes Formular-Input

Familie

Formulare & Eingaben

Sprachen

Delphi, C++ Builder, .NET

QuickStart

Setzen Sie Name, damit der Inhalt zurückgesendet wird, wählen Sie eine Toolbar und ein Theme und lesen Sie dann HTML (oder fügen Sie es in eine TsgcHTMLTemplate_Bootstrap-Seite ein).

uses
  sgcHTML_Component_RichEditor;

var
  oEditor: TsgcHTMLComponent_RichEditor;
begin
  oEditor := TsgcHTMLComponent_RichEditor.Create(nil);
  try
    oEditor.Name := 'body';
    oEditor.Content := '<p>Hello <b>world</b></p>';
    oEditor.Placeholder := 'Write your post...';
    oEditor.Height := '300px';
    oEditor.Toolbar := rtFull;
    oEditor.Theme := reSnow;

    WebModule.Response := oEditor.HTML;   // Quill editor + hidden input
  finally
    oEditor.Free;
  end;
end;

// includes: sgcHTML_Component_RichEditor.hpp

TsgcHTMLComponent_RichEditor *oEditor = new TsgcHTMLComponent_RichEditor(NULL);
try
{
  oEditor->Name = "body";
  oEditor->Content = "<p>Hello <b>world</b></p>";
  oEditor->Placeholder = "Write your post...";
  oEditor->Height = "300px";
  oEditor->Toolbar = rtFull;
  oEditor->Theme = reSnow;

  String html = oEditor->HTML;   // Quill editor + hidden input
}
__finally
{
  delete oEditor;
}

using esegece.sgcWebSockets;

var editor = new TsgcHTMLComponent_RichEditor();
editor.Name = "body";
editor.Content = "<p>Hello <b>world</b></p>";
editor.Placeholder = "Write your post...";
editor.Height = "300px";
editor.Toolbar = TsgcHTMLRichEditorToolbar.rtFull;
editor.Theme = TsgcHTMLRichEditorTheme.reSnow;

string html = editor.HTML;   // Quill editor + hidden input

Referenz

Wichtige Eigenschaften & Methoden

Die Member, die Sie am häufigsten verwenden.

Inhalt

Content initialisiert den Editor mit anfänglichem HTML; Placeholder zeigt einen Hinweistext, solange er leer ist; ReadOnly rendert eine nicht bearbeitbare Ansicht.

Toolbar (TsgcHTMLRichEditorToolbar) wählt rtMinimal, rtBasic oder rtFull, um zu steuern, welche Formatierungsschaltflächen erscheinen.

Theme

Theme (TsgcHTMLRichEditorTheme) wechselt zwischen den Quill-Themes reSnow (umrandete Toolbar) und reBubble (inline).

Formularbindung

Setzen Sie Name, um ein verborgenes <input> auszugeben, dessen Wert mit dem Editor-HTML synchron gehalten wird, sodass er mit dem Formular zurückgesendet wird.

Dimensionierung

Height setzt die Höhe des Editorinhalts (zum Beispiel 300px); EditorID setzt die Element-id, die das Quill-Init-Skript verwendet.

Ausgabe

HTML gibt die Quill-CDN-Links, das Editor-Div, das verborgene Input und das Init-Skript zurück; CSS liefert themenbewusstes Styling für die Seitenvorlage.

Ressourcen

Weiter entdecken

	Alle sgcHTML-KomponentenDurchsuchen Sie die vollständige Funktionsmatrix von über 60 Komponenten.	Öffnen
	Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte.	Öffnen
	PreiseSingle-, Team- und Site-Lizenzen mit vollständigem Quellcode.	Öffnen