1

Estoy tratando verificar un formulario e intento que usando un innerHTML coloque en un párrafo los errores que hubo pero el texto aparece y luego desaparece solo sale durante unos segundos, creo que se debe a que se recarga la pagina pero no se detener la recarga soy algo nuevo. Mi código JS:

const name = document.getElementById('name')
const last = document.getElementById('lastname')
const email = document.getElementById('email')
const quest = document.getElementById('quest')
const form = document.getElementById('form')
const text = document.getElementById('warnings')

form.addEventListener("submit", e=>{
    e.defaultPrevented()
    let warnings = ''
    let send = false
    let regexEmail = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
    text.innerHTML = 'enviado'
    if(name.value.length < 3) {
        warnings += 'El nombre no es valido <br>'
        send = true
    } 
    if(last.value.length < 3) {
        warnings += 'El apellido no es valido <br>'
        send = true
    }     
    if(regexEmail.test(email.value)) {
        warnings += 'El email no es valido <br>'
        send = true
    }
    if(quest.value.length < 15 ) {
        warnings += 'Lo que sabes hacer es muy poco <br>'
        send = true
    }
    if(send) {
        text.innerHTML = warnings
    }
    return false
})

Y mi código HTML:

 <form id="form">
            <input type="text" id="name" name="name" placeholder="nombre(s)" required><input type="text" id="lastname" name="lastname" placeholder="apellidos" required><br>
            <input type="email" id="email" name="email" placeholder="correo electronico" required><br>
            <textarea id="quest" name="quest" rows="10" cols="50" placeholder="que sabes hacer..." required></textarea><br>
            <button class="boton-save">enviar</button>
          </form>
          <p id="warnings">

          </p>

1 respuesta 1

3

Lo que hace tu página es realizar el submit porque esta linea es incorrecta:

e.defaultPrevented()

Como puedes ver aquí, el defaultPrevented devuelve verdadero o falso si es que ha sido llamado un preventDefault que es lo que necesitas establecer allí. Es decir, reemplaza esa línea por:

e.preventDefault()

Puedes mirar cómo funciona el preventDefault aquí

1
  • Gracias Funciono!!
    – NewOw3n
    Commented el 2 dic. 2020 a las 18:41

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.