0

Por alguna extraña razon el formulario no se envia al hacer click al boton de submit. Es la primera vez que me pasa y no logro encontrar la solucion. Ya intente cambiando el button por un input y viceversa y no hubo ningun cambio.

Este es el codigo del fomulario. Se encuentra apartir de la linea 301 del index.html

<form
 class="contact__form"
 id="contact-form"
 action="https://formspree.io/f/xgepnvze"
 method="POST"
>
 <div class="contact__form-name">
   <label for="_replyto">Nombre</label>
   <input
     placeholder="Angelo"
     id="name"
     name="name"
     type="text"
     required
   />
 </div>
 <div class="contact__form-email">
   <label for="_replyto">Email</label>
   <input
     placeholder="[email protected]"
     id="_replyto"
     name="_replyto"
     type="email"
     required
   />
 </div>
 <div class="contact__form-subject">
   <label for="subject">Motivo</label>
   <input
     placeholder="Tengo una idea para una página..."
     id="subject"
     name="subject"
     type="text"
     required
   />
 </div>
 <div class="contact__form-message">
   <label for="message">Mensaje</label>
   <textarea
     placeholder="Esta es mi idea..."
     id="message"
     name="message"
     required
   ></textarea>
 </div>

 <input
   type="submit"
   class="contact__form-submit"
   value="Enviar mensaje"
 />
</form> 

Dejo el codigo del repositorio y subido a netlify para que puedan verlo en vivo y testearlo. Agradeceria muchisimo la ayuda.

https://github.com/Michelgimenez/Portafolio https://practical-colden-8ee7f5.netlify.app/

5
  • te salta algún error u hace la recarga de la pagina al apretar el botón de enviar?
    – tecnobyte
    Commented el 8 dic. 2020 a las 21:30
  • Hola, no. Simplemente hago click y no pasa nada Commented el 8 dic. 2020 a las 21:40
  • ¿Tienes código Javascript en ese contexto? Puede que sea ese código el que esté controlando/escuchando los envíos del form
    – A. Cedano
    Commented el 8 dic. 2020 a las 21:51
  • si, pueden ser que un método este llamando al id del form realice la función preventDefault(), esto evita que no se realice la acción.
    – tecnobyte
    Commented el 8 dic. 2020 a las 21:53
  • Hola no, no estoy usando Javascript para el formulario. Commented el 8 dic. 2020 a las 22:27

2 respuestas 2

1

analizando tu problema y el código que tienes en tu repositorio, al parecer el error lo puedes tener en la sección del scroll

// SCROLL
document.addEventListener("click", function (e) {
  e.preventDefault(); ...

});

Ya que de este lado estas cachando todos los eventos clic. El metodo correcto es que el preventDefault se ejecute dentro de tu if

// SCROLL
document.addEventListener("click", function (e) {
  if (e.target.classList.contains("header__nav-link")) {
    e.preventDefault();
    const id = e.target.getAttribute("href");
    console.log(id);
    document.querySelector(id).scrollIntoView({ behavior: "smooth" });
  }
});

Para que el preventDefault sea de tus header__nav-link y no todo tu documento.

1
  • Muchas gracias, ese era el bug que no podia encontrar. Commented el 8 dic. 2020 a las 23:15
0

A tu código no le pasa nada (al menos al formulario), no se envía en la "plataforma" en que lo estas usando. Ni la consola muestra errores JS. Ni siguiera aparecen avisos de HTML5 por los campos requeridos. Lo he probado en: https://practical-colden-8ee7f5.netlify.app/

Si sacas el formulario a un documento HTML se envía.

El HTML también esta correcto: https://html5.validator.nu/

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.