Componente Testo modulo (v1)

Ultimo aggiornamento: 2023-05-20
  • Argomenti:
  • Core Components
    Visualizza ulteriori informazioni su questo argomento
  • Creato per:
  • Developer
    Admin
    User

Il componente core Testo modulo consente l’inserimento 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, le etichette e i messaggi di aiuto possono essere definiti dall’editor di contenuto nella finestra di dialogo per configurazione.

Versione e compatibilità

Questo documento descrive la versione 1 del componente Testo modulo, originariamente introdotto con la versione 1.0.0 dei Componenti core in AEM 6.3.

La tabella che segue riporta la compatibilità della versione 1 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, vedi il documento Componente Testo modulo.

Esempio di output del componente

Di seguito è riportato un 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 versione 1.1.0 dei Componenti core. Per ulteriori informazioni, vedi le informazioni sulla compatibilità dei Componenti core v1.

Finestra di dialogo per configurazione

La finestra di dialogo per configurazione consente all’autore di 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à effettuata la convalida

    • Testo
    • Area testo
    • E-mail
    • Tel
    • Data
    • Numero
    • Password
  • Righe di testo: numero di righe da visualizzare nell’area di testo (solo se l’opzione Vincolo Limite è impostata su Area testo)

  • Etichetta: l’etichetta che verrà visualizzata per il campo

  • Nascondi l’etichetta: opzione necessaria se l’etichetta serve solo per scopi di accessibilità e non fornisce alcuna informazione visiva aggiuntiva relativa al campo

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

  • Valore: il valore predefinito inserito automaticamente nel campo

Informazioni su

  • Messaggio di aiuto: suggerimento per l’utente per la compilazione del campo
  • Visualizza messaggio di aiuto come segnaposto: indica se deve essere visualizzato il messaggio di aiuto nel modulo, quando il modulo è 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 testo
  • Richiesto: se selezionata, l’utente deve necessariamente inserire un valore prima di inviare il modulo

  • Imposta per sola lettura: se selezionata, l’utente non può modificare il valore del campo

Finestra di dialogo per progettazione

La finestra di dialogo per progettazione non è disponibile 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.

Per ulteriori informazioni sullo sviluppo di Componenti core, vedi la documentazione per gli sviluppatori di Componenti core.

In questa pagina