Pesquisar na Comunidade

Ola pessoa bom dia estou tendo problemas em enviar um form via whatsapp nao esta sendo enviado. e gostaria também que o form ficasse limpo quando for clicado em enviar se atualizar a pagina ele informa que tem conteudo no form.. Fiz da seguinte forma CSS <style> /* STYLE WHATSAPP */ .ws_icon_send { width: 50px; height: 50px; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background: #03877B; } .ws_icon_send img { width: 18px !important; max-width: 18px !important; height: 18px !important; vertical-align: middle !important; } .ws_modal { display: none; /* Hidden by default */ position: absolute; /* Stay in place */ z-index: 2001; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ background-color: rgb(14, 58, 2); /* Fallback color */ background-color: rgba(14, 58, 2, 0.73) } /* ws_modal Content/Box */ .ws_modal-content { margin: 15% auto; /* 15% from the top and centered */ width: 320px; /* Could be more or less, depending on screen size */ height: 494px; border: none; box-shadow: none; text-align: left; } #ws_bg { width: 40px !important; height: 40px !important; margin-top: 55px !important; border-radius: 50% !important; margin-left: 32px !important; } .ws_nome { font-family: Arial !important; color: #fff !important; font-size: 15px !important; margin-top: 60px !important; position: absolute !important; width: 160px !important; height: 20px !important; margin-left: 5px !important; text-transform: capitalize !important; } .ws_online { font-family: Arial !important; color: #fff !important; font-size: 11px !important; margin-top: 80px !important; position: absolute !important; width: 130px !important; height: 20px !important; margin-left: 5px !important; } .ws_modal-content .ws_form { padding-top: 10px; font-family: Arial, Helvetica, sans-serif; } .ws_form p { margin: 0px !important; padding: 0px 20px !important; } .ws_form input { border: 0 solid #848484 !important; height: 16px !important; background: #F7FFF0 !important; font-size: 12px !important; box-shadow: 2px 2px 5px #DBDBDB !important; outline: 0 !important; resize: none !important; margin-bottom: 10px !important; border-radius: 3px !important; padding: 10px 10px 15px 10px !important; box-sizing: content-box !important; width: 260px !important; min-height: auto !important; line-height: normal !important; } #ws_retorno { text-align:center; } /* The Close Button */ .ws_close { color: #fff; float: right; font-size: 40px; font-weight: bold; margin-top: -20px; margin-right: -20px; } .ws_close:hover, .ws_close:focus { color: black; text-decoration: none; cursor: pointer; } .ws_pos_titulo { text-transform: uppercase; font-size: 11px; line-height: 17px; font-weight: 500; letter-spacing: .15em; margin-bottom: 7px; color: rgba(0,0,0,0.5); } .ws_pos_atendente { font-size: 33px; line-height: 35px; font-weight: 300; margin-bottom: 24px; font-family: "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; } .ws_horario_funcionamento { font-size: 11px; line-height: 17px; font-weight: 500; letter-spacing: .15em; margin-bottom: 7px !important; color: rgba(0,0,0,0.5); padding: 10px 52px 10px 30px !important; text-align: right !important; } #ws_copyright { font-size: 11px; line-height: 17px; font-weight: 500; letter-spacing: .15em; color: rgba(0,0,0,0.5); text-align:center; margin-top: 5px !important; } #ws_copyright a { color: #666; } .ws_btn_numero { text-transform: uppercase; display: inline-block; font-size: 16px; line-height: 19px; letter-spacing: 0.071em; padding: 23px 46px; border-radius: 40px; font-weight: 500; white-space: nowrap; color: #1cb39b; border: 2px solid #77D7C8; text-decoration: none; background: #fff; } .ws_bg_text { padding: 6px 0 8px 0; padding-left: 15px; padding-right: 10px; background-color: #dcf8c6; float: right; clear: both; border-radius: 7.5px; position: relative; box-shadow: 0 1px 0.5px rgba(0,0,0,0.13); border-top-left-radius: 7.5px; border-top-right-radius: 0px; font-size: 13px; font-family: Arial; margin-bottom: 20px; margin-right: 20px; color: #000 !important; line-height: 1.6 !important; } .ws_separador { clear:both; } .ws_emoji_offline { position: absolute; font-size: 60px; left: -48px; top: -25px; } .ws_link_whatsapp { color: #000; text-decoration: none; } .ws_link_whatsapp:hover, .ws_link_vcard:hover { color: #CE292C; text-decoration: none; } .ws_link_atendente, .ws_link_telefone { color: #19a6e8; text-decoration: underline; } .ws_link_atendente:hover, .ws_link_telefone:hover { color: #1A7B88; text-decoration: underline; } .ws_link_vcard { color: #000; text-decoration: none; } .ws_suc_send { position: absolute; left: -40px; top: -7px; width: 50px; height: 50px; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background: #03877B; } .ws_suc_vcard { position: absolute; left: -40px; top: -7px; width: 50px; height: 50px; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background: #03877B; } </style> SCRIPT <script type="text/javascript"> const setup = (function () { // console.log('setup'); document.getElementById('sendMessage').onsubmit = function (e) { e.preventDefault(); console.log('click'); const country = '55'; const ws_p3 = (document.getElementById('telefone').value || '') .replace(/\D/g, '') .replace(new RegExp(`^${country}`), ''); const ws_p1 = document.getElementById('nome').value; const ws_p2 = document.getElementById('email').value; const ws_p4 = document.getElementById('msg').value; phone = '5569999957255' // o texto ou algo vindo de um <textarea> ou <input> por exemplo message = '*Nome:* ${ws_p1} \n` message += '*E-mail:* ${ws_p2} \n` message += '*Data:*' `<?=date('d/m/Y');?>, <?=date('h:m:s'); ?> \n \n` message += '*Telefone:* ${ws_p3} \n` message += '*Msg:* ${ws_p4} \n` enviar = window.encodeURIComponent(message); if (!ws_p3) { alert('Numero Inválido'); return; } //window.open("https://api.whatsapp.com/send?phone=" + celular + "&text=" + pedido, "_blank"); // const link = `https://wa.me/${country}${phone}?text=${enviar}`; link = `https://web.whatsapp.com/send?phone=${country}${phone}&text=${enviar}`; if ((new MobileDetect(window.navigator.userAgent)).mobile()) { link = `https://api.whatsapp.com/send?phone=${country}${phone}&text=${enviar}`; } console.log(ws_p3, link); window.open(link); }; }) if (window.attachEvent) { window.attachEvent('onload', setup); } else { window.addEventListener('load', setup, false); } </script> HTML <a href="#" data-toggle="modal" data-target="#myModal" style="position:fixed;width:60px;height:60px;bottom:40px;right:40px;text-align:center;font-size:30px;box-shadow: 1px 1px 2px #888; z-index:1000;"> <img style="margin-top:5px" src="../img/icon_chat.gif"> </a> <div id="myModal" style="position:fixed;" class="modal ws_modal"> <div class="ws_modal-content" id="bgModal" style="background: url(&quot;../img/bg-whatsite.png&quot;) center center no-repeat;"> <span class="close">×</span> <span class="ws_foto"> <img id="ws_bg" src="../img/logo.png"></span> <span class="ws_nome">João Carlos</span> <span class="ws_online">online</span> <div id="ws_div_form" class="ws_form"> <div class="ws_horario_funcionamento"> <span style="height: 40px; display: block;">Atendimento via WhatsApp de Seg a ---, das 08:00h às 19:30h.</span></div> <form method="POST" id="sendMessage"> <p><input type="text" name="nome" id="nome" maxlength="40" required="" placeholder="Nome"></p> <p><input type="email" maxlength="40" name="email" id="email" required="" placeholder="E-mail"></p> <p><input type="tel" name="telefone" id="telefone" required="" placeholder="Nº Telefone" maxlength="15"></p> <p><input type="text" name="msg" id="msg" maxlength="250" required="" placeholder="Qual a sua dúvida? "></p> <p><button type="submit" id="send" class="ws_icon_send"><img src="../img/icon_send.png"></button></p> <p id="ws_copyright">by <a href="#" target="_blank">Msg Via WhatsApp</a></p> </form> </div> </div> </div> Desde já agradeço se alguem poder dar uma ajuda