Envio assíncrono de formulários adaptáveis

Tradicionalmente, os formulários web são configurados para envio síncrono. No envio síncrono, quando os usuários enviam um formulário, ele é redirecionado para uma página de confirmação, uma página de agradecimento ou, em caso de falha de envio, uma página de erro. No entanto, experiências modernas da Web, como aplicativos de página única, estão ganhando popularidade, onde a página da Web permanece estática, enquanto a interação cliente-servidor acontece em segundo plano. Agora você pode fornecer essa experiência com formulários adaptáveis configurando o envio assíncrono.

No envio assíncrono, quando um usuário envia um formulário, o desenvolvedor do formulário conecta uma experiência separada, como redirecionar para outro formulário ou uma seção separada do site. O autor também pode conectar serviços separados, como enviar dados para um armazenamento de dados diferente ou adicionar um mecanismo de análise personalizado. No caso de envio assíncrono, um formulário adaptável se comporta como um aplicativo de página única, pois o formulário não é recarregado ou seu URL não é alterado quando os dados do formulário enviado são validados no servidor.

Leia para obter detalhes sobre o envio assíncrono em formulários adaptáveis.

Configurar envio assíncrono

Para configurar o envio assíncrono para um formulário adaptável:

  1. No modo de criação de formulário adaptável, selecione o objeto Contêiner de formulário e toque em cmppr1 para abrir suas propriedades.

  2. No Submissão seção propriedades, habilitar Usar envio assíncrono.

  3. No Ao enviar selecione uma das opções a seguir para executar no envio bem-sucedido do formulário.

    • Redirecionar para URL: Redireciona para o URL ou página especificada no envio do formulário. Você pode especificar um URL ou navegar para escolher o caminho para uma página no Redirecionar URL/caminho campo.
    • Mostrar mensagem: Exibe uma mensagem no envio do formulário. Você pode escrever uma mensagem no campo de texto abaixo da opção Mostrar mensagem. O campo de texto oferece suporte à formatação Rich Text.

  4. Toque botão de seleção1 para salvar as propriedades.

Como funciona o envio assíncrono

O AEM Forms fornece manipuladores de erros e sucesso prontos para uso para envios de formulários. Os manipuladores são funções do lado do cliente que são executadas com base na resposta do servidor. Quando um formulário é enviado, os dados são transmitidos ao servidor para validação, o que retorna uma resposta ao cliente com informações sobre o sucesso ou o evento de erro do envio. As informações são passadas como parâmetros para o manipulador relevante para executar a função.

Além disso, autores e desenvolvedores de formulários podem gravar regras no nível de formulário para substituir manipuladores padrão. Para obter mais informações, consulte Substituir manipuladores padrão usando regras.

Vamos primeiro analisar a resposta do servidor em busca de eventos bem-sucedidos e de erros.

Resposta do servidor para evento bem-sucedido de envio

A estrutura para a resposta do servidor para o evento bem-sucedido de envio é a seguinte:

{
  contentType : "<xmlschema or jsonschema>",
  data : "<dataXML or dataJson>" ,
  thankYouOption : <page/message>,
  thankYouContent : "<thank you page url/thank you message>"
}

A resposta do servidor em caso de envio de formulário bem-sucedido inclui:

  • Tipo de formato de dados do formulário: XML ou JSON
  • Dados do formulário no formato XML ou JSON
  • Opção selecionada para redirecionar para uma página ou exibir uma mensagem conforme configurado no formulário
  • URL da página ou conteúdo da mensagem, conforme configurado no formulário

O manipulador de sucesso lê a resposta do servidor e, de acordo, redireciona para o URL da página configurada ou exibe uma mensagem.

Resposta do servidor para evento de erro de envio

A estrutura para a resposta do servidor para o evento de erro de envio é a seguinte:

{
   errorCausedBy : "<CAPTCHA_VALIDATION or SERVER_SIDE_VALIDATION>",

   errors : [
               { "somExpression" : "<SOM Expression>",
                 "errorMessage"  : "<Error Message>"
               },
               ...
             ]
 }

A resposta do servidor em caso de erro no envio do formulário inclui:

  • Motivo do erro, CAPTCHA com falha ou validação do lado do servidor
  • Lista de objetos de erro, que inclui a expressão SOM do campo que falhou na validação e a mensagem de erro correspondente

O manipulador de erros lê a resposta do servidor e, portanto, exibe a mensagem de erro no formulário.

Substituir manipuladores padrão usando regras

Desenvolvedores e autores de formulários podem gravar regras, no nível de formulário, no editor de códigos para substituir manipuladores padrão. A resposta do servidor para eventos bem-sucedidos e de erro é exposta no nível do formulário, que os desenvolvedores podem acessar usando $event.data em regras.

Execute as etapas a seguir para gravar regras no editor de códigos para lidar com eventos bem-sucedidos e de erro.

  1. Abra o formulário adaptável no modo de criação, selecione qualquer objeto de formulário e toque em edit-rules1 para abrir o editor de regras.
  2. Selecionar Formulário na árvore Objetos de formulário e toque em Criar.
  3. Selecionar Editor de códigos no menu suspenso de seleção de modo.
  4. No editor de códigos, toque em Editar código. Toque Editar na caixa de diálogo de confirmação.
  5. Choose Envio bem-sucedido ou Erro no envio do Evento lista suspensa.
  6. Escreva uma regra para o evento selecionado e toque em Concluído para salvar a regra.

Nesta página