Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/10/2015, 05:26
Avatar de manyblue
manyblue
 
Fecha de Ingreso: marzo-2008
Mensajes: 329
Antigüedad: 16 años, 1 mes
Puntos: 10
Validar formulario con java script

Un saludo, esto no me funciona que esta mal??
FORMULARIO:
Código HTML:
<form method="POST" class="form-horizontal" action="<?php echo $editFormAction; ?>" name="FormularioAltaUsuario" id="FormularioAltaUsuario" onSubmit="javascript:return ValidarFormulario();">
  <div class="form-group">
      <label for="strNombre" class="col-sm-3 control-label">Nombre:</label>
      <div class="col-sm-4">
        <input type="text" class="form-control" name="strNombre" id="strNombre" placeholder="Nombre">
      </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoNombre">* Nombre es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
      <label for="strApellidos" class="col-sm-3 control-label">Apellidos:</label>
      <div class="col-sm-4">
        <input type="text" class="form-control" name="strApellidos" id="strApellidos" placeholder="Apellidos">
      </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoApellidos">* Apellidos es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strNick_Usuario" class="col-sm-3 control-label">Nick:</label>
    <div class="col-sm-4">
      <input type="text" class="form-control" name="strNick_Usuario" id="strNick_Usuario" placeholder="Nick">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoNick">* Nick o Seudónimo es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strEmail" class="col-sm-3 control-label">Email:</label>
    <div class="col-sm-4">
      <input type="email" class="form-control" name="strEmail" id="strEmail" placeholder="Email">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoEmail">* Email es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
      <div class="alert alert-danger oculto" role="alert" id="AvisoEmailDiferente">* Los Emails no coinciden, revisalos.</div>
  <div class="form-group">
    <label for="strEmail2" class="col-sm-3 control-label">Repetir Email:</label>
    <div class="col-sm-4">
      <input type="email" class="form-control" name="strEmail2" id="strEmail2" placeholder="Repetir Email">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoEmail2">* Repetir Email es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strPassword" class="col-sm-3 control-label">Contraseña:</label>
    <div class="col-sm-3">
      <input type="password" class="form-control" name="strPassword" id="strPassword" placeholder="Contraseña">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoPassword">* Contraseñal es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
       <div class="alert alert-danger oculto" role="alert" id=" AvisoPasswordDiferente">* Las Contraseñas no coinciden, revisalas.</div>
  <div class="form-group">
    <label for="strPassword2" class="col-sm-3 control-label">Repetir Contraseña:</label>
    <div class="col-sm-3">
      <input type="password" class="form-control" name="strPassword2" id="strPassword2" placeholder="Repetir Contraseña">
    </div>
  </div>
   <div class="alert alert-danger oculto" role="alert" id="AvisoPassword2">* Repetir Contraseñal es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strImagen_Usuario" class="col-sm-3 control-label">Imagen:</label>
    <div class="col-sm-3">
      <input type="text" class="form-control" name="strImagen_Usuario" id="strImagen_Usuario" placeholder="Imagen">
    </div>
    <input type="button" value="Subir Imagen" class="btn btn-default" onClick=""> 
  </div>
  <div class="form-group">
    <label for="intTelefono" class="col-sm-3 control-label">Teléfono:</label>
    <div class="col-sm-2">
      <input type="text" class="form-control" name="intTelefono" id="intTelefono" placeholder="Teléfono">
    </div>
  </div>
  <div class="form-group">
    <label for="intMovil" class="col-sm-3 control-label">Movil:</label>
    <div class="col-sm-2">
      <input type="text" class="form-control" name="intMovil" id="intMovil" placeholder="Movil">
    </div>
  </div>
  <div class="form-group">
    <label for="strDireccion" class="col-sm-3 control-label">Dirección:</label>
    <div class="col-sm-6">
      <input type="text" class="form-control" name="strDireccion" id="strDireccion" placeholder="Dirección">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoDireccion">* Dirección es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strPoblacion" class="col-sm-3 control-label">Población:</label>
    <div class="col-sm-4">
      <input type="text" class="form-control" name="strPoblacion" id="strPoblacion" placeholder="Población">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoPoblacion">* Población es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="intCodigo_Postal" class="col-sm-3 control-label">Código Postal:</label>
    <div class="col-sm-2">
      <input type="text" class="form-control" name="intCodigo_Postal" id="intCodigo_Postal" placeholder="Código Postal">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoCodigoPostal">* Código Postal es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strProvincia" class="col-sm-3 control-label">Provincia:</label>
    <div class="col-sm-3">
      <input type="text" class="form-control" name="strProvincia" id="strProvincia" placeholder="Provincia">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoProvincia">* Provincial es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <div class="form-group">
    <label for="strPais" class="col-sm-3 control-label">País:</label>
    <div class="col-sm-3">
      <input type="text" class="form-control" name="strPais" id="strPais" placeholder="País">
    </div>
  </div>
  <div class="alert alert-danger oculto" role="alert" id="AvisoPais">* País es un campo Obligatorio, no puesde estar vacio, por lo que debes rellenarlo.</div>
  <input type="hidden" name="Fecha_Alta_Usuario" id="Fecha_Alta_Usuario" value="<?php echo date("Y-m-d  H:i:s");?>">
  <input type="hidden" name="intEstado" id="intEstado" value="1">
  <input type="hidden" name="intNivel" id="intNivel" value="3">
  <div class="form-group">
    <div class="col-sm-offset-3 col-sm-10">
      <button type="submit" class="btn btn-primary">Registrarse</button>
    </div>
  </div>
  <input type="hidden" name="MM_insert" value="FormularioAltaUsuario">
  </form> 
EL JAVASCRIPT:
Código HTML:
<script>
function ValidarFormulario()
{
    valid = true;
    $("#AvisoNombre").hide("slow");
    $("#AvisoApellidos").hide("slow");
    $("#AvisoNick").hide("slow");
    $("#AvisoEmail").hide("slow");
    $("#AvisoEmail2").hide("slow");
    $("#AvisoPassword").hide("slow");
    $("#AvisoPassword2").hide("slow");
    $("#AvisoDireccion").hide("slow");
    $("#AvisoPoblacion").hide("slow");
    $("#AvisoCodigoPostal").hide("slow");
    $("#AvisoProvincia").hide("slow");
    $("#AvisoPais").hide("slow");
    $("#AvisoEmailDiferente").hide("slow");
    $("#AvisoPasswordDiferente").hide("slow");
    
    if (document.FormularioAltaUsuario.strNombre.value == ""){
        $("#AvisoNombre").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strApellidos.value == ""){
        $("#AvisoApellidos").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strNick_Usuario.value == ""){
        $("#AvisoNick").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strEmail.value == ""){
        $("#AvisoEmail").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strEmail2.value == ""){
        $("#AvisoEmail2").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strPassword.value == ""){
        $("#AvisoPassword").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strPassword2.value == ""){
        $("#AvisoPassword2").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strDireccion.value == ""){
        $("#AvisoDireccion").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strPoblacion.value == ""){
        $("#AvisoPoblacion").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strCodigo_Postal.value == ""){
        $("#AvisoCodigoPostal").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strProvincia.value == ""){
        $("#AvisoProvincia").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strPais.value == ""){
        $("#AvisoPais").show("slow");
        valid = false;
    }
    //FIN ERRORES DE CAMPOS VACIOS
    if (document.FormularioAltaUsuario.strEmail.value != document.FormularioAltaUsuario.strEmail2.value){
        $("#AvisoEmailDiferente").show("slow");
        valid = false;
    }
    if (document.FormularioAltaUsuario.strPassword.value != document.FormularioAltaUsuario.strPassword2.value){
        $("#AvisoPasswordDiferente").show("slow");
        valid = false;
    }
    //FIN ERRORES DE EMAIL Y PASSWOD DIFERENTE
    return valid;
}
</script>
Muchas gracias de antemano: Manyblue