Creare un modulo adattivo

Ultimo aggiornamento: 2023-12-05
  • Creato per:
  • Beginner
    User
    Developer
Versione Collegamento articolo
AEM 6.5 Fai clic qui
AEM as a Cloud Service Questo articolo

I moduli adattivi consentono di creare moduli coinvolgenti e reattivi, che si rivelano, inoltre, dinamici e adattivi. AEM Forms fornisce una procedura guidata intuitiva che consente agli utenti aziendali di creare rapidamente moduli adattivi. La procedura guidata fornisce una navigazione rapida a schede per selezionare facilmente modelli, stili, campi e opzioni di invio preconfigurati per creare un modulo adattivo.

Prima di iniziare, scopri i tipi di componenti dei moduli disponibili:

  • Componenti core dei moduli adattivi: si tratta di componenti di acquisizione dati standardizzati. Questi componenti forniscono funzionalità di personalizzazione e riducono i tempi di sviluppo e i costi di manutenzione per le esperienze di registrazione digitale. Uno sviluppatore può facilmente personalizzare e assegnare uno stile a questi componenti. L’Adobe consiglia di utilizzare questi componenti moderni ed estensibili per sviluppare Forms adattivo.

  • Componenti di base dei moduli adattivi: si tratta dei classici (precedenti) componenti di acquisizione dati. Puoi continuare a utilizzarli per modificare i componenti di base esistenti basati su modulo adattivo. Se stai creando nuovi moduli, l’Adobe consiglia di utilizzare Componenti core Forms adattivi per creare un Forms adattivo.

Creazione guidata di un modulo adattivo

Prerequisiti

Per creare un modulo adattivo è necessario quanto segue:

  • Abilitare i componenti core Forms adattivi per il tuo ambiente: quando crei un programma, i Componenti core adattivi di Forms sono già abilitati per il tuo ambiente. Se disponi di un ambiente Forms as a Cloud Service basato sull’Archetipo 39 o versioni precedenti, consulta Abilitare i componenti core dei moduli adattivi per il tuo ambiente. Quando abiliti i componenti core per il tuo ambiente, vengono aggiunti il modello e l'area di lavoro del componente core moduli adattivi. Se la tua versione dell’SDK di AEM è precedente alla 2023.02.0, assicurati di aver abilitato il flag prerelease nel tuo ambiente , poiché i componenti core dei moduli adattivi facevano parte della versione prerelease precedente alla versione 2023.02.0.

  • Un modello di modulo adattivo: un modello fornisce una struttura di base e definisce l’aspetto (layout e stili) di un modulo adattivo. Include componenti preformattati contenenti determinate proprietà e struttura del contenuto. Fornisce inoltre le opzioni per definire un tema e un’azione di invio. Il tema definisce l’aspetto, mentre l’azione di invio definisce l’azione da intraprendere al momento dell’invio di un modulo adattivo. Ad esempio, l’invio dei dati raccolti a un’origine dati. Il Cloud Service fornisce un modello OOTB, denominato vuoto:

    • Il modello blank è incluso in ogni nuovo programma AEM Forms as a Cloud Service.
    • È possibile installare il pacchetto di riferimento tramite Gestione pacchetti per aggiungere il blank modello al programma AEM Forms as a Cloud Service.
    • È inoltre possibile creare un modello di Forms adattivo (componenti core) da zero.
    • Puoi anche distribuire modelli di esempio nell'ambiente. che consentono di iniziare a creare rapidamente i moduli.

  • Un tema per moduli adattivi: un tema contiene dettagli sullo stile dei componenti e dei pannelli. Gli stili includono proprietà quali i colori di sfondo, i colori degli stati, la trasparenza, l’allineamento e le dimensioni. Quando applichi un tema, lo stile specificato si riflette sui componenti corrispondenti. Il Canvas Questo modello è incluso in ogni nuovo programma as a Cloud Service di AEM Forms. Puoi anche distribuire temi di esempio nell'ambiente. In questo modo è possibile iniziare a definire lo stile dei moduli e fornire una struttura di base per creare o personalizzare un tema in base alle proprie esigenze aziendali.

  • Autorizzazioni: aggiungi gli utenti a un gruppo forms-users. I membri del gruppo forms-users dispongono delle autorizzazioni per creare un modulo adattivo. Per un elenco dettagliato dei gruppi di utenti specifici per moduli, consulta Gruppi e autorizzazioni.

Creare un modulo adattivo

  1. Accedi all’istanza di authoring Experience Manager Forms. Può essere un’istanza Cloud o un’istanza di sviluppo locale.

  2. Inserisci le credenziali nella pagina di accesso di Experience Manager. Dopo aver effettuato l’accesso, nell’angolo in alto a sinistra seleziona Adobe Experience Manager > Forms > Forms e documenti.

  3. Seleziona Crea > Forms adattivo. Viene aperta la procedura guidata. Nella scheda Sorgente, seleziona un modello:

    Modello componenti core

    Quando selezioni un modello, vengono selezionati automaticamente un tema e un’azione di invio specificati nel modello, mentre viene abilitato il pulsante Crea. È possibile passare alle schede Stile o Invio per selezionare un tema o un’azione di invio diversi. Se il modello selezionato non specifica un tema, il pulsante Crea rimane disabilitato. È possibile passare alla scheda Stili per selezionare manualmente un tema.

    NOTA

    Se non disponi del modello Moduli adattivi (componente core) nell’ambiente, abilita la funzione Componenti core dei moduli adattivi per il tuo ambiente. Quando abiliti i componenti core per il tuo ambiente, viene aggiunto il modello Moduli adattivi (componente core).

  4. Nella scheda Stile, seleziona un tema:

    • Quando il modello selezionato specifica un tema, lo stesso viene selezionato automaticamente nella procedura guidata. È possibile inoltre scegliere un tema diverso dalla scheda Stile.

    • Se il modello selezionato non specifica un tema, è possibile utilizzare la scheda Stile per sceglierne uno. Il pulsante Crea viene abilitato solo dopo la selezione di un tema.

  5. (Facoltativo) Nella scheda Dati, seleziona un modello dati:

    • Modello dati modulo: un Modello dati modulo consente di integrare entità e servizi da diverse origini dati a un modulo adattivo. Scegli Modello dati modulo se il modulo adattivo che si sta creando prevede il recupero e la scrittura di dati da e verso più origini dati.

    • Schema JSON: lo Schema JSON è nostro modulo adattivo basato su componenti core che consente l’integrazione perfetta con il sistema back-end della tua organizzazione, grazie alla possibilità di associare uno schema JSON, che rappresenta la struttura dei dati prodotti o utilizzati. Questa associazione consente agli autori di aggiungere contenuti al modulo adattivo in modo dinamico, utilizzando gli elementi dello schema. Gli elementi dello schema sono facilmente accessibili nella scheda Oggetti modello dati del browser Contenuto durante il processo di authoring e tutti i campi vengono aggiunti automaticamente a qualsiasi modulo adattivo creato.

    Per impostazione predefinita, tutti i campi dello schema JSON associato vengono selezionati e convertiti automaticamente nei componenti corrispondenti del modulo adattivo, semplificando il processo di authoring. La procedura guidata offre l’ulteriore comodità di consentire la scelta selettiva dei campi da includere nel modulo adattivo tramite l’utilizzo di caselle di controllo.

  6. Nella scheda Invio, seleziona un’azione di invio:

    • Quando selezioni un modello, l’azione di invio specificata in quel modello viene selezionata automaticamente. Dalla scheda Invio puoi selezionare un’azione di invio diversa. La scheda Invio mostra tutte le azioni di invio disponibili.

    • Se nel modello selezionato non è specificata un’azione di invio, è possibile utilizzare la scheda Invio per selezionarne una.

  7. (Facoltativo) Nella scheda Consegna, è possibile specificare una data di pubblicazione o di annullamento della pubblicazione per un modulo adattivo.

  8. Seleziona Crea. Viene visualizzata una finestra di dialogo che specifica il titolo, il nome e la posizione in cui salvare il modulo adattivo:

    • Titolo: specifica il nome visualizzato del modulo. Il titolo consente di identificare il modulo nell’interfaccia utente di Experience Manager Forms.
    • Nome: specifica il nome del modulo. Nell’archivio viene creato un nodo con il nome specificato. Quando si inizia a digitare un titolo, il valore del campo nome viene generato automaticamente. Puoi modificare il valore suggerito. Il campo nome può contenere solo caratteri alfanumerici, trattini e caratteri di sottolineatura. Tutti gli input non validi vengono sostituiti da un trattino.
    • Percorso: specifica la posizione in cui salvare il modulo adattivo. Puoi salvare il modulo adattivo direttamente all’indirizzo /content/dam/formsanddocuments o creare una cartella di salvataggio come /content/dam/formsanddocuments/adaptiveforms. Assicurati di creare la cartella prima di utilizzarla nel percorso. Il campo Percorso non crea cartelle automaticamente.

  9. Seleziona Crea. Viene creato un modulo adattivo che viene aperto nell’editor di moduli adattivi. L’editor mostra i contenuti disponibili nel modello. In base al tipo di modulo adattivo, gli elementi del modulo presenti nello schema JSON associato o nel modello di dati del modulo vengono visualizzati nella scheda Oggetti modello di dati del Browser contenuti nella barra laterale. Puoi anche trascinare questi elementi per creare il modulo adattivo.

Ora puoi trascinare e rilasciare la Componenti core Forms adattivi al contenitore Forms adattivo per progettare e creare il modulo. Puoi anche visitare https://aemcomponents.dev/ per visualizzare i componenti core disponibili in azione.

Configurare l’azione di invio per un modulo adattivo

Un’azione di invio consente di scegliere la destinazione dei dati acquisiti tramite un modulo adattivo. Viene attivato quando un utente fa clic sul pulsante Invia in un modulo adattivo. I moduli adattivi includono alcune azioni di invio pronte all’uso. Puoi anche estendere un’azione di invio predefinita per creare un’azione di invio personalizzata. Per configurare un'azione di invio per il modulo:

  1. Apri il browser Contenuto e seleziona la Contenitore guida componente del modulo adattivo.

  2. Fai clic sulle proprietà Contenitore guida Proprietà guida icona. Viene visualizzata la finestra di dialogo Contenitore modulo adattivo (Adaptive Form Container).

  3. Fai clic su Invio scheda.

    Fai clic sull’icona chiave inglese per aprire la finestra di dialogo Contenitore modulo adattivo e configurare un’azione di invio

  4. Seleziona e configura un Azione di invio, in base alle tue esigenze. Per informazioni dettagliate sulle azioni di invio, vedere Azione di invio modulo adattivo

Reindirizza l’utente a una pagina o mostra un messaggio di ringraziamento all’invio del modulo

All'invio di un modulo è possibile reindirizzare l'utente a un'altra pagina Web o a un messaggio. Per reindirizzare l’utente o configurare il messaggio di ringraziamento:

  1. Apri il browser Contenuto e seleziona la Contenitore guida componente del modulo adattivo.

  2. Fai clic sulle proprietà Contenitore guida Proprietà guida icona. Viene visualizzata la finestra di dialogo Contenitore modulo adattivo (Adaptive Form Container).

  3. Apri Invio scheda.

    Fai clic sull’icona chiave inglese per aprire la finestra di dialogo Contenitore modulo adattivo per configurare una pagina di reindirizzamento o un messaggio di ringraziamento

    • Per configurare un URL di reindirizzamento, per l’opzione Invia seleziona la Reindirizza a URL e sfoglia e seleziona una pagina AEM Sites oppure specifica l’URL di una pagina esterna.

    • Per configurare un messaggio personalizzato o di ringraziamento, per all’opzione Invia, seleziona la Mostra messaggio e inserisci un messaggio nella sezione Contenuto del messaggio casella. Si tratta di una casella di testo RTF, è possibile utilizzare l'opzione a schermo intero per visualizzare tutti gli elementi RTF disponibili.

Configurare uno schema o un modello di dati del modulo per un modulo adattivo

È possibile utilizzare il modello dati modulo per collegare un modulo a un'origine dati per inviare e ricevere dati in base alle azioni degli utenti. Puoi anche collegare un modulo a uno schema JSON per ricevere i dati inviati in un formato predefinito. In base al requisito, connetti il modulo a uno schema JSON o a un modello di dati del modulo:

Configurare uno schema JSON o un modello dati modulo per il modulo

Per configurare uno schema JSON o un modello dati modulo per il modulo:

  1. Apri il browser Contenuto e seleziona la Contenitore guida componente del modulo adattivo.

  2. Fai clic sulle proprietà Contenitore guida Proprietà guida icona. Viene visualizzata la finestra di dialogo Contenitore modulo adattivo (Adaptive Form Container).

  3. Apri Modello dati scheda.

    Fai clic sull’icona chiave inglese per aprire la finestra di dialogo Contenitore modulo adattivo per configurare uno schema JSON o un modello di dati del modulo

  4. Seleziona e configura uno schema JSON o un modello dati modulo, in base ai requisiti:

    • Quando selezioni il Modello modulo , utilizza Seleziona modello dati modulo per selezionare un modello di dati modulo preconfigurato.
    • Quando selezioni il Schema , utilizza Schema per selezionare uno schema JSON per il modulo.

  5. Clic Fine.

Configurare un servizio di precompilazione

Puoi utilizzare il servizio di precompilazione per compilare automaticamente i campi di un modulo adattivo utilizzando dati esistenti. Quando un utente apre un modulo, i valori di tali campi vengono precompilati. Operazioni disponibili:

Utilizzare il servizio di precompilazione del modello dati modulo per precompilare i campi di un modulo adattivo

È possibile utilizzare il servizio di precompilazione del modello dati modulo per precompilare i campi di un modulo adattivo utilizzando un modello dati modulo o un servizio di precompilazione personalizzato. Il servizio di precompilazione del modello dati del modulo utilizza Ottieni il servizio del modello di dati del modulo configurato per recuperare i dati. Per utilizzare il servizio di precompilazione del modello dati modulo per un modulo adattivo:

  1. Apri il browser Contenuto e seleziona la Contenitore guida componente del modulo adattivo.
  2. Fai clic sulle proprietà Contenitore guida Proprietà guida icona. Viene visualizzata la finestra di dialogo Contenitore modulo adattivo (Adaptive Form Container).
  3. Fai clic sulle proprietà Contenitore modulo adattivo Proprietà contenitore modulo adattivo icona. Viene visualizzata la finestra di dialogo Contenitore modulo adattivo per configurare i modelli dati.
    Fai clic sull’icona chiave inglese per aprire la finestra di dialogo Contenitore modulo adattivo per configurare una pagina di reindirizzamento o un messaggio di ringraziamento
  4. Seleziona un modello di dati modulo. Apri Base scheda. Nel servizio di preriempimento, seleziona Servizio preriempimento modello dati modulo.
  5. Clic Fine. Il modulo adattivo è ora configurato per l’utilizzo della precompilazione del modello dati del modulo. Ora è possibile utilizzare editor di regole per creare regole per precompilare i campi del modulo.

Modificare le proprietà di un modello di modulo adattivo

  1. Seleziona il modulo adattivo e seleziona Informazioni pagina > Apri proprietà. Viene visualizzata la pagina Proprietà modulo.

  2. Vai alla scheda Modello modulo e scegli un modello di modulo. Se il modulo adattivo non dispone di un modello di modulo, puoi scegliere uno schema JSON o un modello di dati del modulo. Se invece il modulo adattivo si basa già su un modello di modulo, puoi passare a un altro modello dello stesso tipo. Ad esempio, se il modulo utilizza uno schema JSON, puoi passare facilmente a un altro schema JSON e, analogamente, se il modulo utilizza un modello dati del modulo, puoi passare a un altro modello dati del modulo.

  3. Seleziona Salva per salvare le proprietà.

Consulta anche

Pagina precedente
Next page

In questa pagina