1

Mi validación no se hace cuando envío los datos ... la única función que me llama es la de validar

<script src="../validar.js"></script>

<form id="formu" action="registro2.php" method="POST" class="form register" onsubmit="return validar();" >

function validarc(){

    var nombre,correo,mensaje;
    nombre=document.getElementById("name").value;
email=document.getElementById("email").value;
    mensaje=document.getElementById("mensaje").value;

    if(nombre === "")   
{
   alert("El campo del nombre esta vacío"); 
    document.getElementById("name").focus();
    return false;
    }else if(email=== ""){
     alert("El campo del correo esta vacío"); 
     document.getElementById("email").focus();
    return false;
                }else if(mensaje=== ""){
     alert("El campo del mensaje esta vacío"); 
     document.getElementById("mensaje").focus();
    return false;
                }
}


function validarl(){

    var correo,password5;
    correo=document.getElementById("usuario").value;
password5=document.getElementById("pass").value;

    if(correo === "")   
{
   alert("El campo del correo esta vacío"); 
    document.getElementById("correo").focus();
    return false;
    }else if(password5=== ""){
     alert("El campo contraseña esta vacío"); 
     document.getElementById("password5").focus();
    return false;
                }
}

function hideOrShowPassword(){ 
    var password1,password2,check;

     password1=document.getElementById("password1");
    password2=document.getElementById("password2");
     check=document.getElementById("ver");

    if(check.checked==true) // Si la checkbox de mostrar contraseña está activada
    {
        password1.type = "text";
        password2.type = "text";

    }
    else // Si no está activada 
    {
        password1.type = "password";
        password2.type = "password";

    }
}


function validar(){

    var nombre,usuario,email,sexo,fecha,password1,password2,sexo2;
    nombre=document.getElementById("nombre").value;
    usuario=document.getElementById("usuario").value;
    email=document.getElementById("email").value;
    password1=document.getElementById("password1").value;
    password2=document.getElementById("password2").value;
    sexo1=document.getElementById("masculino").checked;

     sexo2=document.getElementById("femenino").checked;
    fecha=document.getElementById("fecha").value;

    if(nombre === "")   
{
   alert("El campo nombre esta vacio"); 
    document.getElementById("nombre").focus();
    return false;

    }else if(nombre.length>50 || nombre.length<5){
     alert("Los nombres deben contar entre 5 y 50 caracteres"); 
        document.getElementById("nombre").focus();
    return false;
    }else if(usuario=== ""){
     alert("El campo usuario esta vacio"); 
        document.getElementById("usuario").focus();
    return false;
         }else if(usuario.length>50 || usuario.length<3){
     alert("El nombre de usuario deben contar entre 3 y 50 caracteres"); 
             document.getElementById("usuario").focus();
    return false;
             }else if(password1=== ""){
     alert("El campo contraseña esta vacio"); 
            document.getElementById("password1").focus();
    return false;
                }else if(password1.length>40 || password1.length<6){
     alert("La contraseña debe contar entre 6 y 40 caracteres"); 
       document.getElementById("password1").focus();
    return false;
        }else if(password2=== ""){
     alert("Verifique su contraseña"); 
       document.getElementById("password2").focus();       
    return false;
        }
        else if(email=== "" ){
     alert("El campo email esta vacio"); 
            document.getElementById("email").focus();
    return false; }
        else if(fecha=== null || fecha===""){
     alert("Ingrese su fecha de nacimiento"); 
            document.getElementById("fecha").focus();
    return false; 

                }else if(email.length>40){
     alert("Correo muy largo"); 
        document.getElementById("email").focus();          
    return false;}

    if(password1 === password2){
        }else{ 
            alert("Las contraseñas no coinciden"); 
              document.getElementById("password2").focus();
    return false;
            }

 if(sexo1==false && sexo2==false ){
     alert("Indique su sexo"); 
    return false;
        }

    }
4
  • ¿Por qué no validas directamente en los controles? Tienes muchos tipos de input como email, number y atributos como min, max, required y pattern para realizar validaciones complejas por medio de expresiones regulares.
    – gugadev
    el 25 jun. 2017 a las 12:39
  • prefiero validarlo por javascript ... es que la verdad las validaciones me servían pero de la nada ya no me sirvieron el 25 jun. 2017 a las 14:42
  • Ahí te he puesto un ejemplo que hace lo mismo que tú pero con un código muy reducido por si te sirve igualmente..
    – gugadev
    el 25 jun. 2017 a las 14:49
  • muchas gracias por tu ayuda el 25 jun. 2017 a las 14:53

3 respuestas 3

4

HTML5 está disponible desde el año 2012; no hay razón para no aprovechar sus beneficios y esto incluye, la validación de formularios. Ahora puedes usar la validación HTML5 para hacer este proceso mucho más sencillo por medio de atributos como required y pattern que permiten validaciones complejas inline; además de la API de validación.

Ejemplo

const validar = (form) => {
  const {
    username,
    email,
    password,
    repassword,
    sex
  } = form;
  let flag = true;
  
  if (!username.checkValidity()) {
    alert(username.title);
    flag = false;
  }
  else if (!email.checkValidity()) {
    alert(email.title);
    flag = false;
  }
  else if (!password.checkValidity()) {
    alert(password.title);
    flag = false;
  }
  else if (!repassword.checkValidity()) {
    alert(repassword.title);
    flag = false;
  }
  else if (password.value !== repassword.value) {
    alert('Las contraseñas no coinciden');
    flag = false;
  }
  else if (!sex[0].checkValidity() || !sex[1].checkValidity()) {
    alert(sex[0].title);
    flag = false;
  }
  return flag;
}
#sex-area > span,
#sex-area > .radio-group {
  display: inline-block;
}
<form novalidate onsubmit="return validar(this)">
  <header>
    <h3>Registrarse</h3>
  </header>
  <article>
    <input 
      type="text" 
      name="username" 
      placeholder="Nombre de usuario" 
      pattern="[0-9A-Za-z]{3,50}"
      title="Ingrese un nombre de usuario con solo caracteres alfanúmericos entre 3 y 50 caracteres"
      required
    />
    <input 
      type="email" 
      name="email" 
      placeholder="Correo electrónico" 
      title="Ingrese un correo electrónico válido."
      required
    />
    <input
      type="password"
      name="password"
      placeholder="Contraseña"
      pattern="(?=.*[0-9])(?=.*[!@#$%^&*])[a-zA-Z0-9!@#$%^&*]{6,40}$"
      title="Ingrese una contraseña segura: mínimo un mayúscula, número y un carácter especial entre 6 y 40 caracteres"
      required
    />
    <input 
      type="password" 
      name="repassword" 
      placeholder="Verifique contraseña"
      title="Ingrese nuevamente su contraseña"
      required 
    />
    <section id="sex-area">
      <span>Sexo</span>
      <div class="radio-group">
        <input 
          type="radio" 
          name="sex" 
          value="m" 
          text="M" 
          title="Seleccione su sexo"
          required 
        />
        M
        <input 
          type="radio" 
          name="sex" 
          value="f" 
          title="Seleccione su sexo" 
          required
        />
        F
      </div>
    </section>
  </article>
  <footer>
    <button>Registrar</button>
  </footer>
</form>

Hoy en día tienes varios frameworks y librerías frontend para mostrar los errores de validaciones de forma más amigables, como son , , o librerías para plano o .

4

Podrias intentar validar desde el mismo documento html, adjuntando el script para no tener problemas como el siguiente ejemplo mi amigo.

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Registro de usuario</title>
  <link rel="stylesheet" href="estilos.css">
  <link rel="icon" type="image/jpg" href="../recursos/favicon.jpg">
  <script type="text/javascript">
  window.onload = function () {
    document.formulario.nombre.focus();
    document.formulario.addEventListener('submit', validar);
  }
  function validar(evObject) {
    evObject.preventDefault();
    var ok = true;
    var formulario_registro = document.formulario;
    for (var i = 0; i < formulario_registro.length; i++){
      if(formulario_registro[i].type == 'text'){
        if(formulario_registro[i].value == null || formulario_registro[i].value.length == 0 || /^\s*$/.test(formulario[i].value)){
          alert(formulario[i].name + ' no puede estar vacio o solo contener espacios en blanco.');
          ok = false;
          break;
        }
      }
    }
    if(isNaN(formulario_registro.edad.value) == true || /^[1-9]\d$/.test(formulario_registro.edad.value) == false) {
      alert("Edad no valida.");
      ok = false;
    }
    if(isNaN(formulario_registro.noexterior.value) == true) {
      alert("Número exterior invalido.");
      ok = false;
    }
    if(isNaN(formulario_registro.nointerior.value) == true || /^[1-9]\d$/.test(formulario_registro.nointerior.value) == false) {
      alert("Numero interior invalido.");
      ok = false;
    }
    if(/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(formulario_registro.correo.value) == false) {
      alert("Direccion de correo invalida.");
      ok = false;
    }
    if(formulario_registro.password.value != formulario_registro.r_password.value) {
      alert("Las contraseñas no coinciden.");
      ok = false;
    }
    if(ok == true) {
      formulario_registro.submit();
    }
  }
  </script>
</head>
<body>

1
  • Al dar clic al botón ejecutar este devuelve error. Si no pretendes que el código se ejecute directamente en esta página, no se debería incluir dentro de Stack Snippet.
    – Rubén
    el 25 jun. 2017 a las 18:07
1

Prueba con un doble igual para comparar valores, el triple igual se utiliza para también comparar el tipo y es más estricto y no necesario para validar un formulario.

function validar(){

        var nombre,usuario,email,sexo,fecha,password1,password2,sexo2;
        nombre=document.getElementById("nombre").value;
        usuario=document.getElementById("usuario").value;
        email=document.getElementById("email").value;
        password1=document.getElementById("password1").value;
        password2=document.getElementById("password2").value;
        sexo1=document.getElementById("masculino").checked;
        sexo2=document.getElementById("femenino").checked;
        fecha=document.getElementById("fecha").value;

        if(nombre == "") {
         alert("El campo nombre esta vacio"); 
         document.getElementById("nombre").focus();
         return false;
        } else if(nombre.length>50 || nombre.length<5){
         alert("Los nombres deben contar entre 5 y 50 caracteres"); 
         document.getElementById("nombre").focus();
         return false;
        } 
      ...
        else if(!sexo1 && !sexo2){
         alert("Indique su sexo"); 
         return false;
        }

      }

Espero que te funcione.

6
  • probe eso y sigue sin funcionar lo raro es que la validación del login la hice igual y si sirve el 25 jun. 2017 a las 14:54
  • Es extraño porque en principio parece todo correcto. Has comprobado que llegas correctamente a la función validar, por ejemplo haciendo un alert nada más empezar la función?
    – Carmen
    el 25 jun. 2017 a las 14:59
  • eso si no lo he intentado ... porque como tú puedas observar tengo más funcionas y sirve hasta la de hideorshowpassword el 25 jun. 2017 a las 15:13
  • Solo por descartar que el problema sea que no accede
    – Carmen
    el 25 jun. 2017 a las 15:24
  • mm donde debo colocar el alert? o como? ... porque esas validaciones son para un registro entonces no imporrta que los campos esten vacios si le doy a enviar ... pues envía todo a la bdd el 25 jun. 2017 a las 15:25

Tu Respuesta

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

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