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:
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.
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.
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:
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.
Nella finestra Editor regole, fai clic su Crea.
Seleziona Editor visivo nella riga Oggetti e funzioni modulo.
Nell'area della regola, in QUANDO, selezionare lo stato ha fatto clic su.
Sotto THEN:
Seleziona Editor di codice nella riga Oggetti e funzioni modulo. Clic Modifica regole e nell'area di codice:
this.panel.instanceManager.addInstance()
this.panel.instanceManager.removeInstance(this.panel.instanceIndex)
Clic Fine.
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.
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.
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:
Nell’elemento padre del pannello da ripetere, tocca . Puoi visualizzare le proprietà nella barra laterale. In Layout a discesa, seleziona Accordion.
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.
La sottomaschera ripetibile è simile ai pannelli ripetibili in Adaptive Forms. Per creare una sottomaschera ripetuta in AEM Forms Designer, effettuare le seguenti operazioni:
Il file .zip allegato contiene un modulo secondario ripetibile di esempio.
È 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à SampleType
utilizza 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>
Per il layout non pannello a soffietto, utilizza i componenti pulsante per moduli adattivi per aggiungere e rimuovere le istanze.