Criação de formulários com seções repetíveis creating-forms-with-repeatable-sections

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Tópicos:

Criado para:

Administrador
Usuário
Desenvolvedor

O Adobe recomenda o uso de Componentes principaisde captura de dados moderna e extensível para criar um novo Forms Adaptávelou adicionar o Forms Adaptável às páginas do AEM Sites. Esses componentes representam um avanço significativo na criação do Forms adaptável, garantindo experiências de usuário impressionantes. Este artigo descreve a abordagem mais antiga para criar o Forms adaptável usando componentes de base.

Seções repetíveis são painéis que podem ser adicionados ou removidos dinamicamente de um formulário.

Por exemplo, ao se candidatar a um cargo, o candidato a cargo fornece detalhes do emprego anterior, como nome da empresa, função, projeto e outras informações. A informação de todos os empregadores requer seções diferentes, mas semelhantes. Nesse cenário, o formulário de emprego fornece uma seção de empregador e também uma opção para adicionar dinamicamente mais seções. Essas seções, que são adicionadas dinamicamente, são conhecidas como seções Repetíveis.

Você pode usar um dos seguintes métodos para criar painéis repetíveis:

Usando o Instance Manager por meio de scripts using-instance-manager-via-scripts-nbsp

No modo de edição, selecione um painel e, em seguida, selecione . Na barra lateral, em Propriedades, habilite Tornar o Painel Repetível. Especifique valores para os campos Máximo e Mínimo.

O campo Máximo especifica o número máximo de vezes que um painel pode aparecer na página. Você pode especificar -1 no campo Contagem máxima para permitir que o painel apareça por um número infinito de vezes.

O campo Minimum especifica o número mínimo de vezes que um painel é exibido no formulário. Se você definir o campo The Minimum Count como zero posteriormente, será possível remover todas as instâncias por meio de scripts depois que a representação for concluída.

note note
NOTE
Para criar um painel não repetível, defina o valor dos campos Máximo e Mínimo como um. O layout do Accordion não é compatível com -1 no campo Contagem máxima. Você pode especificar um número alto para dar a noção de valor infinito.

O pai do painel, que deve ser repetido, deve conter os botões adicionar e excluir para gerenciar ocorrências dos painéis repetíveis. Execute as seguintes etapas para inserir botões no pai e ativar scripts nos botões:

Na barra lateral, arraste e solte um componente de botão no pai do painel. Selecione o componente e selecione . As regras do botão são abertas no editor de regras.

Na janela Editor de regras, clique em Criar.

Selecione o Editor Visual na linha Objetos de Formulário e Funções.

Na área de regras, em QUANDO, selecione o estado é clicado.
Em THEN:
- Para criar um botão adicionar painel, selecione Adicionar Instância e arraste e solte o painel usando ou selecione-o usando Soltar objeto ou selecione aqui.
- Para criar um botão de exclusão do painel, selecione Remover instância e arraste e solte o painel usando ou selecione-o usando Soltar objeto ou selecione aqui.

Selecione o Editor de Código na linha Objetos de Formulário e Funções. Clique em Editar regras e na área de código:

Para criar um botão adicionar painel, especifique this.panel.instanceManager.addInstance()
Para criar um botão de exclusão do painel, especifique this.panel.instanceManager.removeInstance(this.panel.instanceIndex)

Clique em Concluído.

note note
NOTE
Se um campo pertencer a um painel repetível, você não poderá acessá-lo diretamente usando seu nome nos scripts. Para acessar o campo, especifique a instância repetível à qual o campo pertence usando a API `instances` em `InstanceManager`. A sintaxe para usar a API `instances` em `InstanceManager` é:
`<panelName>.instanceManager.instances[<instanceNumber>].<fieldname>`
Por exemplo, você cria um formulário adaptável com um painel repetível com uma caixa de texto. Ao preencher previamente o formulário com três caixas de texto repetíveis, é necessário o xml abaixo:
`<panel1><textbox1>AA1</panel1></textbox1>`
`<panel1><textbox1>AA2</panel1></textbox1>`
`<panel1><textbox1>AA3</panel1></textbox1>`
Para ler os dados AA1, especifique:
`Panel1.instanceManager.instances[0].textbox.value`
Para ler os dados AA2, especifique:
`Panel1.instanceManager.instances[1].textbox.value`
Para obter mais informações, consulte: Classe: InstanceManager#instances em Referência à API Java do AEM Forms.

note note
NOTE
Quando todas as instâncias de um painel forem removidas de um formulário adaptável, para adicionar uma instância do painel removido, use a sintaxe _panelName para capturar o gerenciador de instâncias do painel e a API addInstance do gerenciador de instâncias para adicionar a instância excluída. Por exemplo, _panelName.addInstance(). Ele adiciona uma instância do painel removido.

Uso do layout do acordeão no painel principal using-the-accordion-layout-for-the-parent-panel-nbsp

Um painel tem várias opções de layout. A opção Layout para design do acordian tem suporte imediato para painéis repetíveis. Execute as seguintes etapas para o painel repetível com a opção Layout para design do acordian:

No pai do painel a ser repetido, selecione . Você pode ver as propriedades na barra lateral. No menu suspenso Layout, selecione Acordeão.
Em um painel a ser repetido, selecione . Você pode ver as propriedades do painel na barra lateral. Habilite a guia Tornar o Painel Repetível e especifique o valor para os campos Máximo e Mínimo.

Agora, você pode usar os botões de adição (+) e exclusão ( ) para adicionar e remover os painéis.

Uso de subformulários repetidos do Modelo de formulário (XDP/XSD) using-repeating-subforms-from-form-template-xdp-xsd

O subformulário repetível é semelhante aos painéis repetíveis no Adaptive Forms. No AEM Forms Designer, execute as seguintes etapas para criar um subformulário repetitivo:

Na paleta Hierarquia, selecione o subformulário pai do subformulário que deseja repetir.
Na paleta Objeto, clique na guia Subformulário e, na lista Conteúdo, selecione Fluxo.
Selecione o subformulário a ser repetido.
Na paleta Objeto, clique na guia Subformulário e, na lista Conteúdo, selecione Posicionado ou Fluxado.
Clique na guia Vinculação e selecione Repetir subformulário para cada item de dados.
Para especificar o número mínimo de repetições, selecione Contagem Mínima e digite um número na caixa associada. Se essa opção estiver definida como 0 e nenhum dado for fornecido para os objetos no subformulário no momento da mesclagem de dados, o subformulário não será colocado quando o formulário for renderizado.
Para especificar o número máximo de repetições do subformulário, selecione Máximo e digite um número na caixa associada. Se você não especificar um valor na caixa Máx., o número de repetições de subformulário será ilimitado.
Para especificar um número definido de repetições de subformulário, independentemente da quantidade de dados, selecione Contagem inicial e digite um número na caixa associada. Se você selecionar essa opção e não houver dados disponíveis ou houver menos entradas de dados do que o valor de Contagem inicial especificado, instâncias vazias do subformulário ainda serão colocadas no formulário.
Adicione dois botões no subformulário pai — um para adicionar a instância e outro para excluir a instância do subformulário repetível. Para obter etapas detalhadas, consulte Criar uma ação.
Agora, vincule o Modelo de formulário ao Formulário adaptável. Para obter etapas detalhadas, consulte Criar um formulário adaptável com base em um modelo.
Use os botões criados na etapa 9 para adicionar e remover subformulários.

O arquivo .zip anexado contém uma amostra de subformulário repetível.

Obter arquivo

Usando configurações de repetição de um Esquema XML (XSD) using-repeat-settings-of-an-xml-schema-xsd-br

Você pode criar painéis repetíveis de um Esquema XML e da propriedade minOccours & maxOccurs de qualquer elemento de tipo complexo. Para obter informações detalhadas sobre o Esquema XML, consulte Criar formulários adaptáveis usando o Esquema XML como Modelo de Formulário.

No código a seguir, o painel SampleType usa a propriedade 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>

NOTE

Para layout que não seja do acordeão, use componentes do botão de formulário adaptável para adicionar e remover instâncias.

recommendation-more-help

19ffd973-7af2-44d0-84b5-d547b0dffee2