Criação de um Formulário adaptável creating-an-adaptive-form-core-components
Formulários adaptáveis permitem criar formulários envolventes, responsivos, dinâmicos e adaptáveis. O AEM Forms fornece um assistente comercial fácil de usar para criar rapidamente formulários adaptáveis. O assistente fornece uma navegação por guias rápidas para selecionar facilmente modelos pré-configurados, estilos, campos e as opções de envio para criar um formulário adaptável.
Antes de começar, saiba mais sobre o tipo de componentes do Forms disponíveis para você:
-
Componentes principais de formulários adaptáveis: Esses são componentes de captura de dados padronizados. Esses componentes oferecem recursos de personalização, redução do tempo de desenvolvimento e dos custos de manutenção para suas experiências de inscrição digital. Um desenvolvedor pode personalizar e estilizar facilmente esses componentes. A Adobe recomenda o uso desses componentes modernos e extensíveis para desenvolver o Adaptive Forms.
-
Componentes de fundamentais de formulários adaptáveis: esses são componentes clássicos (antigos) de captura de dados. Você pode continuar usando-os para editar seus componentes fundamentais já existentes com base no formulário adaptável. Se você estiver criando novos formulários, o Adobe recomenda usar Componentes principais adaptáveis do Forms para criar uma Forms adaptável.
Pré-requisitos
Você precisará do seguinte para criar um formulário adaptável:
-
Ativar os Componentes principais adaptáveis do Forms para o seu ambiente: ao criar um programa, os Componentes principais adaptáveis do Forms já estão habilitados para o seu ambiente. Se possuir um ambiente do Forms as a Cloud Service baseado no arquétipo 39 ou anterior, Habilite os componentes principais dos formulários adaptáveis no seu ambiente. Ao habilitar os componentes principais no seu ambiente, o modelo Formulários adaptáveis (Componente principal) e o tema da tela são adicionados ao seu ambiente. Se sua versão do SDK do AEM for anterior à 2023.02.0, certifique-se de que
prerelease
o sinalizador esteja habilitado em seu ambiente, pois os componentes principais dos formulários adaptáveis faziam parte do pré-lançamento antes da versão 2023.02.0. -
Um modelo de formulário adaptável: um modelo fornece uma estrutura básica e define a aparência (layouts e estilos) de um formulário adaptável. Ele tem componentes pré-formatados que contêm determinadas propriedades e estrutura de conteúdo. Também fornece as opções para definir um tema e uma ação de envio. O tema define a aparência, e a ação de envio define a ação a ser executada no envio de um formulário adaptável. Por exemplo, enviar os dados coletados para uma fonte de dados. O serviço de nuvem fornece um modelo OOTB, chamado de em branco:
- O modelo
blank
está incluído em todos os novos programas do AEM Forms as a Cloud Service. - É possível instalar o pacote de referência, por meio do Gerenciador de pacotes, para adicionar o modelo
blank
para o seu programa do AEM Forms as a Cloud Service. - Também é possível criar um modelo do Forms adaptável (Componentes principais) do zero.
- Também é possível implantar modelos de amostra ao seu ambiente. Isso o ajuda a começar a criar formulários rapidamente.
- O modelo
-
Um tema de formulários adaptáveis: um tema contém detalhes de estilo para os componentes e painéis. Os estilos incluem propriedades como cores de fundo, cores de estado, transparência, alinhamento e tamanho. Ao aplicar um tema, o estilo especificado é refletido nos componentes correspondentes. A variável
Canvas
O modelo de está incluído em todos os novos programas do AEM Forms as a Cloud Service. Também é possível implantar temas de amostra ao seu ambiente. Isso o ajuda a começar a estilizar seus formulários e a fornecer uma estrutura básica para criar ou personalizar um tema de acordo com os requisitos da empresa. -
Permissões: adicionar usuários ao grupo forms-users. Os membros do grupo forms-users tem permissões para criar formulários adaptáveis. Para obter uma lista detalhada de grupos de usuários específicos de formulários, consulte Grupos e permissões.
Criação de um Formulário adaptável create-an-adaptive-form-core-components
-
Faça logon na Instância do autor do Experience Manager Forms. Pode ser uma instância da nuvem ou uma instância de desenvolvimento local.
-
Insira suas credenciais na página de logon do Experience Manager. Depois de fazer logon, no canto superior esquerdo, selecione Adobe Experience Manager > Forms > Forms e documentos.
-
Selecionar Criar > Forms adaptável. O Assistente será aberto. Na guia Origem, selecione um modelo:
Ao selecionar um modelo, o tema e a ação de envio especificados no modelo são selecionados automaticamente e o botão Criar será habilitado. Você pode ir para as guias Estilo ou Envio para selecionar um tema ou uma ação de envio diferente. Se o modelo selecionado não especificar um tema, o botão criar permanecerá desabilitado. É possível ir para a guia Estilos para selecionar um tema manualmente.
note note NOTE Se você não tiver o modelo Formulários adaptáveis (componente principal) em seu ambiente, Habilite os Componentes principais dos formulários adaptáveis para o seu ambiente. Ao habilitar os componentes principais no seu ambiente, o modelo Formulários adaptáveis (Componente principal) será adicionado ao seu ambiente. -
Na guia Estilo, selecione um tema:
-
Quando o modelo selecionado especifica um tema, ele é selecionado automaticamente no assistente. Você também pode escolher um tema diferente da guia de Estilo.
-
Se o modelo selecionado não especificar um tema, será possível usar a guia de Estilo para escolher um tema. O botão Criar só será ativado depois que um tema for selecionado.
-
-
(Opcional) Na guia Dados, selecione um modelo de dados:
-
Modelo de dados do formulário: um Modelo de dados do formulário permite integrar entidades e serviços de diferentes fontes de dados a um formulário adaptável. Escolha a opção Modelo de dados de formulário se o formulário adaptável que você está criando envolve a obtenção e gravação de dados de e para várias fontes de dados.
-
Esquema JSON: Esquema JSON nosso formulário adaptável baseado em componentes principais permite a integração perfeita com o sistema back-end da sua organização, fornecendo a capacidade de associar um esquema JSON, que representa a estrutura dos dados que estão sendo produzidos ou consumidos. Essa associação permite que os autores adicionem conteúdo dinamicamente ao Formulário adaptável usando os elementos do esquema. Os elementos do esquema são facilmente acessíveis na guia Objetos do modelo de dados do navegador de conteúdo durante o processo de criação e todos os campos são adicionados automaticamente a qualquer formulário adaptável criado.
Por padrão, todos os campos do esquema JSON associado são selecionados e convertidos automaticamente nos componentes de Formulários adaptáveis correspondentes, simplificando o processo de criação. O assistente oferece a conveniência adicional de permitir a escolha seletiva de quais campos devem ser incluídos no Formulário adaptável usando caixas de seleção.
-
-
Na guia Envio, selecione uma ação de envio:
-
Ao selecionar um modelo, a ação de envio especificada no modelo é selecionada automaticamente. É possível selecionar uma ação de envio diferente na guia Envio. A guia Envio exibe todas as ações de envio disponíveis.
-
Quando o modelo selecionado não especificar uma ação de envio, você poderá usar a guia Envio para selecionar uma
-
-
(Opcional) Na guia Entrega, é possível especificar uma data de publicação ou cancelamento da publicação para um Formulário adaptável.
-
Selecione Criar. Uma caixa de diálogo para especificar o título, o nome e o local para salvar o Formulário adaptável será exibida:
- Título especifica o nome de exibição do formulário. O título ajuda a identificar o formulário na interface do usuário do Experience Manager Forms.
- Nome: especifica o nome do formulário. Um nó com o nome especificado será criado no repositório. Ao começar a digitar um título, o valor do campo de nome é gerado automaticamente. É possível alterar o valor sugerido. O campo de nome pode incluir apenas caracteres alfanuméricos, hifens e sublinhados. Todas as entradas inválidas são substituídas por um hífen.
- Caminho: especifica o local no qual o Formulário adaptável deverá ser salvo. É possível salvar o formulário adaptável diretamente em
/content/dam/formsanddocuments
ou criar uma pasta como/content/dam/formsanddocuments/adaptiveforms
para salvar um Formulário adaptável. Certifique-se de criar a pasta antes de usá-la no caminho. O campo Caminho não cria uma pasta automaticamente.
-
Selecione Criar. Um Formulário adaptável será criado e aberto no editor de Formulários adaptáveis. O editor exibirá o conteúdo disponível no modelo. Com base no tipo de formulário adaptável, os elementos de formulário presentes no esquema JSON associado ou no modelo de dados de formulário são exibidos na guia Objetos do modelo de dados do Navegador de conteúdo na barra lateral. Também é possível arrastar e soltar esses elementos para criar seu formulário adaptável.
Agora, você pode arrastar e soltar a variável Componentes principais adaptáveis do Forms para o contêiner Adaptive Forms para projetar e criar o formulário. Você também pode visitar https://aemcomponents.dev/ para ver os componentes principais disponíveis em ação.
Configurar a ação enviar para um formulário adaptável configure-submit-action-for-form
Uma ação enviar permite escolher o destino dos dados capturados por meio de um formulário adaptável. É acionado quando um usuário clica no botão Enviar em um Formulário adaptável. Os formulários adaptáveis incluem algumas ações de envio prontas para uso. Você também pode estender ações de envio padrão para criar sua própria ação de envio personalizada. Para configurar uma Ação de envio para o formulário:
-
Abra o Navegador de conteúdo e selecione a variável Contêiner do guia componente do seu Formulário adaptável.
-
Clique nas propriedades do Container do guia ícone. A caixa de diálogo Contêiner de formulário adaptável é aberta.
-
Clique em Envio guia.
-
Selecionar e configurar um Enviar ação, com base nas suas necessidades. Para obter informações detalhadas sobre Ações de Envio, consulte Ação de envio do formulário adaptável
Redirecionar o usuário para uma página ou mostrar uma mensagem de agradecimento no envio do formulário
No envio de um formulário, você pode redirecionar o usuário para outra página da Web ou uma mensagem. Para redirecionar o usuário ou configurar a mensagem de agradecimento:
-
Abra o Navegador de conteúdo e selecione a variável Contêiner do guia componente do seu Formulário adaptável.
-
Clique nas propriedades do Container do guia ícone. A caixa de diálogo Contêiner de formulário adaptável é aberta.
-
Abra o Envio guia.
-
Para configurar um URL de redirecionamento, para na opção Enviar, selecione o Redirecionar para URL e procure e selecione uma página do AEM Sites ou forneça o URL de uma página externa.
-
Para configurar uma mensagem personalizada ou de agradecimento, para na opção Enviar, selecione o Mostrar mensagem e forneça uma mensagem na caixa de diálogo Conteúdo da mensagem caixa. É uma caixa de rich text, você pode usar a opção de tela cheia para exibir todos os itens de rich text disponíveis.
-
Configurar um esquema ou modelo de dados de formulário para um formulário adaptável configure-schema-or-data-model-for-form
Você pode usar o modelo de dados do formulário e conectar um formulário a uma fonte de dados para enviar e receber dados com base nas ações do usuário. Também é possível conectar um formulário a um esquema JSON para receber os dados enviados em um formato predefinido. De acordo com os requisitos, conecte o formulário a um esquema JSON ou modelo de dados do formulário:
Configurar um esquema JSON ou um modelo de dados de formulário para o formulário
Para configurar um Esquema JSON ou um Modelo de dados de formulário para seu formulário:
-
Abra o Navegador de conteúdo e selecione a variável Contêiner do guia componente do seu Formulário adaptável.
-
Clique nas propriedades do Container do guia ícone. A caixa de diálogo Contêiner de formulário adaptável é aberta.
-
Abra o Modelo de dados guia.
-
Selecione e configure um esquema JSON ou um modelo de dados de formulário, com base em seus requisitos:
- Ao selecionar a variável Modelo de formulário , use o Selecionar modelo de dados do formulário opção para selecionar um modelo de dados de formulário pré-configurado.
- Ao selecionar a variável Esquema , use o Esquema opção para selecionar um esquema JSON para o formulário.
-
Clique em Concluído.
Configurar um serviço de preenchimento configure-prefill-service-for-form
Você pode usar o serviço de preenchimento prévio para preencher automaticamente os campos de um Formulário adaptável usando dados existentes. Quando um usuário abre um formulário, os valores desses campos são preenchidos previamente. É possível:
Usar o serviço de preenchimento do modelo de dados de formulário para preencher previamente os campos de um formulário adaptável fdm-prefill-service
Você pode usar o serviço de preenchimento do modelo de dados de formulário para preencher previamente os campos de um formulário adaptável usando um modelo de dados de formulário ou um serviço de preenchimento prévio personalizado. O serviço de Preenchimento do modelo de dados de formulário usa o Obter serviço do modelo de dados de formulário configurado para recuperar dados. Para usar o serviço de Preenchimento de modelo de dados de formulário para um Formulário adaptável:
- Abra o Navegador de conteúdo e selecione a variável Contêiner do guia componente do seu Formulário adaptável.
- Clique nas propriedades do Container do guia ícone. A caixa de diálogo Contêiner de formulário adaptável é aberta.
- Clique nas propriedades do Contêiner de formulário adaptável
ícone. A caixa de diálogo Contêiner de formulário adaptável para configurar os Modelos de dados é aberta.
- Selecione um modelo de dados de formulário. Abra o Básico guia. No serviço de preenchimento, selecione Serviço de preenchimento do modelo de dados de formulário.
- Clique em Concluído. O formulário adaptável agora está configurado para usar o Preenchimento prévio do modelo de dados de formulário. Agora você pode, use o editor de regras para criar regras para preencher previamente os campos do formulário.
Edição das propriedades do modelo de formulário de um formulário adaptável edit-form-model
-
Selecione o Formulário adaptável e selecione > Abrir propriedades. A página Propriedades do formulário será aberta.
-
Vá para a guia Modelo de formulário e escolha um modelo de formulário. Se o formulário adaptável não tiver um modelo de formulário, você terá a liberdade de escolher um esquema JSON ou um modelo de dados de formulário. Por outro lado, se o formulário adaptável já estiver baseado em um modelo de formulário, você terá a opção de alternar para outro modelo de formulário do mesmo tipo. Por exemplo, se o formulário estiver usando um esquema JSON, você poderá alternar facilmente para outro esquema JSON e, de forma semelhante, se o formulário estiver usando um Modelo de dados de formulário, você poderá alternar para outro Modelo de dados de formulário.
-
Selecionar Salvar para salvar as propriedades.
Consulte também see-also
- Criar um formulário adaptável de AEM
- Adicionar um formulário adaptável de AEM à página do AEM Sites
- Aplicar temas a um formulário adaptável de AEM
- Adicionar componentes a um formulário adaptável de AEM
- Usar CAPTCHA em um formulário adaptável de AEM
- Gerar versão do PDF (DoR) de um formulário adaptável AEM
- Traduzir um formulário adaptável de AEM
- Ativar o Adobe Analytics para um formulário adaptável para rastrear o uso do formulário
- Conectar o formulário adaptável ao Microsoft SharePoint
- Conectar o formulário adaptável ao Microsoft Power Automate
- Conectar o formulário adaptável ao Microsoft OneDrive
- Conectar o formulário adaptável ao armazenamento de blobs do Microsoft Azure
- Conectar o formulário adaptável ao Salesforce
- Usar o Adobe Sign em um formulário adaptável AEM
- Adicionar uma nova localidade para um Formulário adaptável
- Enviar dados do Formulário adaptável a um banco de dados
- Enviar dados do formulário adaptável para um endpoint REST
- Enviar dados do formulário adaptável para o fluxo de trabalho do AEM
- Usar o Forms Portal para listar AEM Adaptive Forms em um site de AEM
- Adicionar comportamento dinâmico a formulários usando o editor de regras
- Definir layout de formulários para diferentes tamanhos de tela e tipos de dispositivo