Show Menu
TOPICS×

Componente Pulsante Modulo

Il componente di base Pulsante Modulo del componente permette di includere un pulsante per attivare un’azione su una pagina.

Utilizzo

Il componente Pulsante Modulo componente di base consente di creare un campo pulsante, spesso per attivare l’invio del modulo e deve essere utilizzato insieme al componente Contenitore modulo.
Le proprietà del pulsante possono essere definite dall'editor del contenuto nella finestra di dialogo di configurazione.

Versione e compatibilità

La versione corrente del componente Pulsante Modulo è v2, introdotto con la release 2.0.0 dei componenti core nel gennaio 2018, ed è descritto in questo documento.
La tabella seguente elenca tutte le versioni supportate del componente, le versioni AEM con cui sono compatibili le versioni del componente e i collegamenti alla documentazione delle versioni precedenti.
Versione componente
AEM 6.3
AEM 6.4
AEM 6.5
v2
Compatibile
Compatibile
Compatibile
Compatibile
Compatibile
Compatibile
Per ulteriori informazioni sulle versioni e sulle versioni dei componenti core, consulta il documento Versioni dei componenti core.

Output componente di esempio

Esempio tratto da We.Retail .

Schermata

HTML

<div class="container responsivegrid 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="cmp-form 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="button aem-GridColumn aem-GridColumn--default--12"> <button type="BUTTON" class="cmp-form-button" name="loveToast" value="ILoveToast">Click here if you love toast!</button> </div> </form> </div>

JSON

"button":{ "columnClassNames":"aem-GridColumn aem-GridColumn--default--12", ":type":"core/wcm/sandbox/components/form/button/v2/button", "name":"loveToast", "jcr:title":"Click here if you love toast!", "type":"button", "value":"ILoveToast" }

Dettagli tecnici

La documentazione tecnica più recente sul componente Pulsante Modulo è disponibile su GitHub .
Per ulteriori informazioni sullo sviluppo dei componenti core, consulta la documentazione per lo sviluppatore di componenti core.

Configura finestra di dialogo

La finestra di dialogo di configurazione consente all'autore del contenuto di definire i parametri del pulsante.

Scheda Proprietà

  • Tipo
    • Pulsante
    • Invia
  • Titolo
    - Testo visualizzato sul pulsante
    • Se non ne è stato fornito nessuno, per impostazione predefinita viene utilizzato il tipo di pulsante
  • Nome
    - Il nome del pulsante, inviato con i dati del modulo
  • Valore
    - Il valore del pulsante, inviato con i dati del modulo

Finestra di dialogo Progettazione

Scheda Stili

Il componente Pulsante Modulo supporta AEM Style System .