Como abrir um alerta popup quando o usuário fechar a página / aba do navegador

  • HumanCareBrasil
    Perguntado em 18 de janeiro de 2021 às 08:31

    Bom dia.

    Eu configurei este item no meu form "Continuar Formulário Mais Tarde" mas ele apenas deixa o botão SALVAA disponível.


    Consigo usar uma function ou alguma outra opção para um popup avisar se ele vai sair da pagina sem salvar?

    Um cliente meu, perdeu os dados pois fechou sem salvar, mesmo tendo o botão lá em baixo.


    Agradeço

  • Eduardo_H
    Respondido em 18 de janeiro de 2021 às 10:44

    Olá, @HumanCareBrasil

    Infelizmente não contamos com um recurso de aviso popup ao deixar a "aba/página".

    Note que , caso você esteja utilizando o formulário incorporado dentro de uma página de website, é possível fazê-lo com um código javascript relativamente simples,:

          <script>
            function openLightBox() {
                var btn = document.querySelector("a.btn");
                btn.click();
             }
             window.addEventListener('beforeunload', function (e) {
                e.preventDefault();
                openLightBox();
                e.returnValue = 'Are you sure you want to leave?';
             });
          </script>

    DEMO: https://shots.jotform.com/adrian/embed/lightshot/83182387594974.html

    Note que para este código funcionar:

    - O usuário precisa clicar pelo menos uma vez em algum ponto da página
    - O formulário precisa ser incorporado utilizando o método lightbox (Confira todos os métodos aqui: https://www.jotform.com/pt/help/771-que-codigo-de-incorporacao-devo-usar)


    Caso esta não seja uma opção, recomendo incluir um breve aviso ao usuário de que deve clicar no botão salvar se quiser manter o registro do formulário, utilizando um campo de texto simples ("Parágrafo").

    1610984564 6005ac743b940 Screenshot(1) Screenshot 10

    Note também que pode ser interessante manter ativa, nas configurações de seu formulário, a opção "Permitir preenchimento automático do navegador". Veja na imagem:

    1610984338 6005ab92679df Screenshot Screenshot 21

    Com esta opção, em muitos casos o navegador do usuário irá manter um registro do preenchimento anterior e recuperá-lo na próxima vez em que o usuário abrir a página, mesmo que não tenha sido salva.


    Espero ter ajudado. Seguimos à disposição.