Script para conversão de formulário para whatsapp

Script para conversão de formulário para whatsapp

by RamonECOWD

HTML

<link rel="stylesheet" href="https://componentes.interago.com.br/bootstrap-grid.css">
<link rel="stylesheet" href="https://componentes.interago.com.br/global-css.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.13/jquery.mask.js"></script>
<div class="i-form-01">
            <div id="formContainer">
            <input type="hidden" id="origem" name="origem"
              value="Nome do SITE - Formulário de agendamento" />

              <div class="boxField">
              <label for="nome">Nome completo</label>
                <input type="text" class="formInput mt0" id="nome" placeholder="Nome completo" name="nome" />
              </div>

              <div class="boxField">
              <label for="phone">Telefone</label>
                <input type="text" class="formInput" id="phone" placeholder="Telefone" name="phone" />
              </div>

              <div class="boxField">
              <label for="mensagem">Mensagem adicional</label>
                <input type="text" class="formInput mt0" id="mensagem" placeholder="Mensagem Adicional" name="mensagem" />
              </div>

            <div class="boxField">
            <a id="iSendButton" class="btnSubmit btn btnDefault needCheck"><i
                class="fab fa-whatsapp"></i>Enviar agendamento</a>
            </div>

          </div>
          </div>

JavaScript

    let iSendButton = document.getElementById("iSendButton");


    let formName = document.querySelector('#nome');

    let formDDD = document.querySelector('#phone');

    let formPhone = document.querySelector('#mensagem');

    formName.addEventListener('focusout', checkEmpty);

    formDDD.addEventListener('focusout', checkEmpty);

    formPhone.addEventListener('focusout', checkEmpty);

    //send form main event

    iSendButton.addEventListener("click", (e) => {

      if (checkEmpty() != false) {

        // pega a largura da tela
              var screenWidth = window.innerWidth;

        if (screenWidth >= 991) {

          window.open('https://web.whatsapp.com/send?phone=55#####1&text=Estava%20no%20Website%20e%20gostaria%20de%20agendar%20%0a%0aMeu%20nome:%20'+formName.value+'%20%0aMeu%20numero:%20'+formDDD.value+'%20%0aMensagem:%20'+formPhone.value+'', '_blank');

        }

        else {
          window.open('https://api.whatsapp.com/send?phone=55#####&text=Estava%20no%20Website%20e%20gostaria%20de%20agendar%20%0a%0aMeu%20nome:%20'+formName.value+'%20%0aMeu%20numero:%20'+formDDD.value+'%20%0aData:%20'+formPhone.value+'', '_blank');
          
        }

        /* //all cool to send

        document.querySelector('#iSendButton').innerHTML = 'Enviando...';

        document.querySelector('#iSendButton').classList.add('needCheck');


        setTimeout(function () {

          //document.getElementById('formContainer').innerHTML = '<div class="col-12"><p id="formSuccessfullSend">Mensagem enviada! Aguarde e embreve retornaremos seu contato!</p></div>';

          window.location.href = "https://www.nomedosite.com.br/obrigado-pelo-contato";

        }, 1500); */

      }

    });

    //simple check empty

    function checkEmpty() {

      let errorBorderColor = "2px solid #e58787";

      let okBorderColor = "1px solid #dedede";

      let nome = document.getElementById("nome");

      let ddd = document.getElementById("phone");

      let phone =...