Formulartext-Komponente (v1)

Die Kernkomponente „Formulartext-Komponente“ ermöglicht die Eingabe von Formulartext zur Übermittlung.

Nutzung

Die Formulartext-Komponente ermöglicht die Übermittlung verschiedener Texttypen und sollte zusammen mit der Formular-Container-Komponente verwendet werden.

Der Typ der Textvalidierung, Beschriftung und Hilfemeldungen kann vom Inhaltseditor im Dialogfeld „Konfigurieren“ definiert werden.

Version und Kompatibilität

In diesem Dokument wird die Version 1 der „Formulartext-Komponente“ beschrieben, die ursprünglich mit der Version 1.0.0 der Kernkomponenten mit AEM 6.3 eingeführt wurde.

In der folgenden Tabelle ist die Kompatibilität der Version 1 der Formulartext-Komponente aufgeführt.

Musterkomponentenausgabe

Im Folgenden finden Sie ein Beispiel von We.Retail.

Screenshot

HTML

<div class="cmp cmp-form aem-GridColumn aem-GridColumn--default--12">
 <form method="POST" action="/content/we-retail/us/en/experience.html" id="new_form" name="new_form" enctype="multipart/form-data" class="aem-Grid aem-Grid--12 aem-Grid--default--12 ">
     <input type="hidden" name=":formstart" value="/content/we-retail/us/en/experience/jcr:content/root/responsivegrid/container">
     <div class="cmp cmp-form-field aem-GridColumn aem-GridColumn--default--12">
   <div class="form-group">
       <label for="form-text-978484744">How many pieces of toast would you like?</label>
          <input type="number" id="form-text-978484744" name="pieces">
   </div>
  </div>
 </form>
</div>

JSON

"container": {
              "columnClassNames": "aem-GridColumn aem-GridColumn--default--12",
              "columnCount": 12,
              "gridClassNames": "aem-Grid aem-Grid--12 aem-Grid--default--12",
              ":items": {
                "text": {
                  "columnClassNames": "aem-GridColumn aem-GridColumn--default--12",
                  ":type": "weretail/components/form/text",
                  "name": "piecesOfToast",
                  "jcr:title": "How many pieces of toast would you like?",
                  "type": "number",
                  "rows": "2"
                }
              },
              ":itemsOrder": [
                "text"
              ],
              ":type": "weretail/components/form/container"
            }

Dialogfeld „Konfigurieren“

Das Dialogfeld „Konfigurieren“ ermöglicht es dem Inhaltsautor, den Texttyp sowie Standardwerte und Beschriftungen zu definieren.

Allgemein

• Beschränkung - Der Typ des einzustellenden Texts und der validiert wird mit

  • Text
  • Textbereich
  • E-Mail
  • Tel
  • Datum
  • Nummer
  • Kennwort

• Textzeilen - Anzahl der im Textbereich anzuzeigenden Zeilen (nur angezeigt, wenn Beschränkung auf Textbereich festgelegt ist).

• Beschriftung - Die Beschriftung, die für das Feld angezeigt wird

• Beschriftung ausblenden - Erforderlich, wenn die Beschriftung nur für Ein-/Ausgabehilfe erforderlich ist und keine zusätzlichen visuellen Informationen über das Feld enthält.

• Elementname - Der Name des mit den Formulardaten gesendeten Felds.

• Wert - Standardwert, der im Feld vorausgefüllt wird

Info

• Hilfemeldung – Ein Hinweis für den Benutzer dahingehend, was im Feld eingegeben werden kann
• Hilfemeldung als Platzhalter anzeigen - Bestimmt, ob die Hilfemeldung in der Formulareingabe angezeigt wird, wenn sie leer ist und sich nicht im Fokus befindet

Begrenzungen

• Beschränkungsmeldung

  • Meldung wird beim Senden des Formulars als QuickInfo angezeigt, wenn der Wert den ausgewählten Typ nicht validiert
  • Wird nicht für Beschränkungstypen Text und Textbereich angezeigt

• Erforderlich - Gibt an, ob der Benutzer einen Wert ausfüllen muss, bevor das Formular senden kann

• Schreibgeschützt: Wenn ausgewählt, kann der Benutzer den Wert des Felds nicht ändern

Dialogfeld „Design“

Es gibt kein Dialogfeld „Design“ für die Formulartext-Komponente.

Technische Details

Die neueste technische Dokumentation zur Formulartext-Komponente finden Sie auf GitHub.

Das gesamte Kernkomponentenprojekt kann von GitHub heruntergeladen werden.

Weitere Informationen zur Entwicklung von Kernkomponenten finden Sie in der Dokumentation zu Kernkomponenten für Entwickler.

Ressourcen für Business.Adobe.com