Creazione di moduli con sezioni ripetibili

L’Adobe consiglia di utilizzare l’acquisizione dati moderna ed estensibile Componenti core per creazione di un nuovo Forms adattivo o aggiunta di Forms adattivo alle pagine AEM Sites. Questi componenti rappresentano un progresso significativo nella creazione di Forms adattivi, garantendo esperienze utente straordinarie. Questo articolo descrive un approccio precedente all’authoring di Forms adattivi utilizzando i componenti di base.

Le sezioni ripetibili sono pannelli che possono essere aggiunti o rimossi dinamicamente in un modulo.

Ad esempio, quando si candida a una mansione, la persona in cerca di occupazione fornisce dettagli precedenti sull'impiego come il nome della società, il ruolo, il progetto e altre informazioni. L'informazione di tutti i datori di lavoro richiede sezioni di aspetto diverso ma simile. In questo scenario, il modulo per l'impiego fornisce una sezione datore di lavoro e fornisce anche un'opzione per aggiungere dinamicamente più sezioni di questo tipo. Queste sezioni, che vengono aggiunte dinamicamente, sono note come Sezioni ripetibili.

Per creare pannelli ripetibili, potete utilizzare uno dei seguenti metodi:

Utilizzo di Instance Manager tramite script 

1. In modalità di modifica, seleziona un pannello, quindi tocca . Nella barra laterale, in Proprietà, abilita Rendi il pannello ripetibile. Specifica i valori per Massimo e Minimo campi.

   Il campo Massimo specifica il numero massimo di volte in cui un pannello può essere visualizzato sulla pagina. Puoi specificare -1 nel campo Conteggio massimo per consentire la visualizzazione del pannello per un numero infinito di volte.

   Il campo Minimum (Minimo) specifica il numero minimo di volte in cui un pannello viene visualizzato nel modulo. Se imposti il campo Conteggio minimo su zero, in un secondo momento potrai rimuovere tutte le istanze tramite script al termine della rappresentazione.

   NOTA

   Per creare un pannello non ripetibile, impostate il valore dei campi Massimo e Minimo su uno. Il layout del Pannello a soffietto non supporta -1 nel campo Conteggio massimo. Puoi specificare un numero alto per dare la nozione di valore infinito.

2. L’elemento principale del pannello, che deve essere ripetuto, deve contenere pulsanti di aggiunta ed eliminazione per gestire le istanze dei pannelli ripetibili. Per inserire pulsanti nell'elemento padre e attivare gli script sui pulsanti, effettuare le seguenti operazioni:

   1. Dalla barra laterale, trascina un componente pulsante nell’elemento principale del pannello. Seleziona il componente e tocca . Le regole del pulsante si aprono nell’editor di regole.

   2. Nella finestra Editor regole, fai clic su Crea.

      Seleziona Editor visivo nella riga Oggetti e funzioni modulo.

      1. Nell'area della regola, in QUANDO, selezionare lo stato ha fatto clic su.

      2. Sotto THEN:

         • Per creare un pulsante Aggiungi pannello, seleziona Aggiungi istanza, e trascina il pannello tramite o selezionala utilizzando Rilascia l’oggetto o seleziona qui.
         • Per creare un pulsante Elimina pannello, seleziona Rimuovi istanza, e trascina il pannello tramite o selezionala utilizzando Rilascia l’oggetto o seleziona qui.

      Seleziona Editor di codice nella riga Oggetti e funzioni modulo. Clic Modifica regole e nell'area di codice:

      • Per creare un pulsante Aggiungi pannello, specifica this.panel.instanceManager.addInstance()
      • Per creare un pulsante Elimina pannello, specifica this.panel.instanceManager.removeInstance(this.panel.instanceIndex)

      Clic Fine.

      NOTA

      Se un campo appartiene a un pannello ripetibile, non è possibile accedervi direttamente utilizzando il relativo nome negli script. Per accedere al campo, specifica l’istanza ripetibile a cui appartiene il campo utilizzando instances API in InstanceManager. Sintassi da utilizzare per instances API in InstanceManager è:

      <panelName>.instanceManager.instances[<instanceNumber>].<fieldname>

      Ad esempio, puoi creare un modulo adattivo con un pannello ripetibile con una casella di testo. Quando si precompila il modulo con tre caselle di testo ripetibili, è necessario il codice xml seguente:

      <panel1><textbox1>AA1</panel1></textbox1>

      <panel1><textbox1>AA2</panel1></textbox1>

      <panel1><textbox1>AA3</panel1></textbox1>

      Per leggere i dati AA1, specifica:

      Panel1.instanceManager.instances[0].textbox.value

      Per leggere i dati AA2, specifica:

      Panel1.instanceManager.instances[1].textbox.value

      Per ulteriori informazioni, vedere Classe: InstanceManager#instances in Riferimento API Java di AEM Forms.

      NOTA

      Quando tutte le istanze di un pannello vengono rimosse da un modulo adattivo, per aggiungere un’istanza del pannello rimosso, utilizza la sintassi _panelName per acquisire la gestione delle istanze del pannello e l’API addInstance di gestione istanze per aggiungere l’istanza eliminata. _panelName.addInstance(). Aggiunge un’istanza del pannello rimosso.

Utilizzo del layout Pannello a soffietto per il pannello principale  

Un pannello dispone di varie opzioni di layout. L’opzione Layout per pannello a soffietto supporta i pannelli ripetibili come funzionalità integrata. Effettua le seguenti operazioni per creare un pannello ripetibile con l’opzione Layout per la progettazione del pannello a soffietto:

1. Nell’elemento padre del pannello da ripetere, tocca . Puoi visualizzare le proprietà nella barra laterale. In Layout a discesa, seleziona Accordion.

2. In un pannello da ripetere, tocca . Puoi visualizzare le proprietà del pannello nella barra laterale. Abilita Rendi il pannello ripetibile e specifica il valore per la scheda Massimo e Minimo campi.

   Ora è possibile utilizzare il segno più (+) ed eliminare ( ) per aggiungere e rimuovere i pannelli.

Utilizzo di sottomaschere ripetute dal modello di modulo (XDP/XSD)

La sottomaschera ripetibile è simile ai pannelli ripetibili in Adaptive Forms. Per creare una sottomaschera ripetuta in AEM Forms Designer, effettuare le seguenti operazioni:

1. Nella tavolozza Gerarchia selezionare la sottomaschera padre della sottomaschera che si desidera ripetere.
2. Nella tavolozza Oggetto fare clic sulla scheda Sottomodulo e nell'elenco Contenuto selezionare Flussi.
3. Selezionare la sottomaschera da ripetere.
4. Nella tavolozza Oggetto, fare clic sulla scheda Sottomodulo e selezionare Posizionato o Flusso nell'elenco Contenuto.
5. Fare clic sulla scheda Associazione e selezionare Ripeti sottomaschera per ogni elemento dati.
6. Per specificare il numero minimo di ripetizioni, selezionare Conteggio minimo e digitare un numero nella casella associata. Se questa opzione è impostata su 0 e non vengono forniti dati per gli oggetti nel sottomodulo al momento dell'unione dei dati, il sottomodulo non viene posizionato al momento del rendering del modulo.
7. Per specificare il numero massimo di ripetizioni di sottomaschera, selezionare Max e digitare un numero nella casella associata. Se non si specifica un valore nella casella Max, il numero di ripetizioni della sottomaschera è illimitato.
8. Per specificare un numero impostato di ripetizioni di sottomaschera, indipendentemente dalla quantità di dati, selezionare Conteggio iniziale e digitare un numero nella casella associata. Se si seleziona questa opzione e non sono disponibili dati o sono presenti meno voci di dati rispetto al valore Conteggio iniziale specificato, le istanze vuote del sottomodulo verranno comunque inserite nel modulo.
9. Aggiungere due pulsanti nella sottomaschera padre: uno per aggiungere un'istanza e un altro per eliminare un'istanza di una sottomaschera ripetibile. Per i passaggi dettagliati, consulta Creare un’azione.
10. Collega ora il modello di modulo al modulo adattivo. Per i passaggi dettagliati, consulta Creare un modulo adattivo basato su un modello.
11. Utilizzare i pulsanti creati nel passaggio 9 per aggiungere e rimuovere sottomaschere.

Il file .zip allegato contiene un modulo secondario ripetibile di esempio.

Ottieni file

Utilizzo delle impostazioni di ripetizione di uno schema XML (XSD)

È possibile creare pannelli ripetibili da uno schema XML e dalla proprietà minOccours & maxOccurs di qualsiasi elemento di tipo complesso. Per informazioni dettagliate sullo schema XML, vedere Creare moduli adattivi utilizzando lo schema XML come modello di modulo.

Nel codice seguente, la proprietà SampleTypeutilizza la proprietà minOccours & maxOccurs.

<?xml version="1.0" encoding="utf-8" ?>
    <xs:schema targetNamespace="https://adobe.com/sample.xsd"
                    xmlns="https://adobe.com/sample.xsd"
                    xmlns:xs="https://www.w3.org/2001/XMLSchema"
                >

        <xs:element name="sample" type="SampleType"/>

        <xs:complexType name="SampleType">
            <xs:sequence>
                <xs:element name="leaderName" type="xs:string" default="Enter Name"/>
                <xs:element name="assignmentStartDate" type="xs:date"/>
                <xs:element name="gender" type="GenderEnum"/>
                <xs:element name="noOfProjectsAssigned" type="IntType"/>
                <xs:element name="assignmentDetails" type="AssignmentDetails"
                                            minOccurs="0" maxOccurs="10"/>
            </xs:sequence>
        </xs:complexType>

        <xs:complexType name="AssignmentDetails">
            <xs:attribute name="name" type="xs:string" use="required"/>
            <xs:attribute name="durationOfAssignment" type="xs:unsignedInt" use="required"/>
            <xs:attribute name="numberOfMentees" type="xs:unsignedInt" use="required"/>
             <xs:attribute name="descriptionOfAssignment" type="xs:string" use="required"/>
             <xs:attribute name="financeRelatedProject" type="xs:boolean"/>
       </xs:complexType>
  <xs:simpleType name="IntType">
            <xs:restriction base="xs:int">
            </xs:restriction>
        </xs:simpleType>
  <xs:simpleType name="GenderEnum">
            <xs:restriction base="xs:string">
                <xs:enumeration value="Female"/>
                <xs:enumeration value="Male"/>
            </xs:restriction>
        </xs:simpleType>
    </xs:schema>