Componente testo modulo (v1)

Il componente Testo modulo componente principale consente l’immissione di testo del modulo per l’invio.

Utilizzo

Il componente Testo modulo consente l'invio di diversi tipi di testo e deve essere utilizzato insieme al componente contenitore modulo.

Il tipo di convalida del testo, etichette e messaggi della guida può essere definito dall'editor di contenuti nella finestra di dialogo configura.

Versione e compatibilità

Questo documento descrive la v1 del componente Testo modulo, introdotto originariamente con la release 1.0.0 dei componenti core con AEM 6.3.

La tabella seguente elenca la compatibilità di v1 del componente Testo modulo.

Versione di AEM Componente testo modulo v1
6.3 Compatibile
6.4 Compatibile
ATTENZIONE

Questo documento descrive la versione 1 del componente Testo modulo.

Per informazioni dettagliate sulla versione corrente del componente Testo modulo, vedere il documento Componente Testo modulo.

Esempio di output del componente

Esempio tratto da We.Retail.

Schermata

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"
            }
NOTA

L’esportazione JSON dai componenti core richiede la release 1.1.0 dei componenti core. Per ulteriori informazioni, vedere le informazioni sulla compatibilità per i componenti core v1.

Configura finestra di dialogo

La finestra di dialogo di configurazione consente all’autore del contenuto di definire il tipo di testo da inserire, nonché i valori e le etichette predefiniti.

Principale

  • Vincolo : il tipo di testo da inserire e su cui verrà convalidato il comando

    • Testo
    • Area testo
    • E-mail
    • Tel.
    • Data
    • Numero
    • Password
  • Righe di testo - Numero di righe da visualizzare nell'area di testo (visualizzate solo se ​Limite è impostata su Area di testo)

  • Etichetta - Etichetta che verrà visualizzata per il campo

  • Nascondere l'etichetta per la visualizzazione - Necessario se l'etichetta è necessaria solo a scopo di accessibilità e non invia ulteriori informazioni visive sul campo

  • Nome elemento: il nome del campo inviato con i dati del modulo

  • Valore - Valore predefinito precompilato nel campo

Informazioni su

  • Messaggio della Guida: un suggerimento per l'utente sulle informazioni che è possibile immettere nel campo
  • Visualizza messaggio di aiuto come segnaposto : per visualizzare il messaggio di aiuto all'interno del modulo di input quando è vuoto e non è attivo

Vincoli

  • Messaggio vincolo

    • Messaggio visualizzato come descrizione comando quando si invia il modulo, se il valore non convalida il tipo scelto
    • Non visualizzato per i tipi di vincolo Testo e Area di testo
  • Obbligatorio : se selezionato, l'utente deve compilare un valore prima di inviare il modulo

  • Rendi sola lettura - Se selezionato, l'utente non può modificare il valore del campo

Finestra di dialogo Progettazione

Non è disponibile una finestra di dialogo per il componente Testo modulo.

Dettagli tecnici

La documentazione tecnica più recente sul componente Testo modulo è disponibile su GitHub.

L’intero progetto dei componenti core può essere scaricato da GitHub.

Ulteriori dettagli sullo sviluppo di componenti core sono disponibili nella documentazione per lo sviluppo di componenti core.

In questa pagina