Foros del Web » Programando para Internet » PHP »

[SOLUCIONADO] Detener envio de formulario con Ajax

Estas en el tema de Detener envio de formulario con Ajax en el foro de PHP en Foros del Web. Hola! Estoy realizando las validaciones de un formulario de registro y quiero hacerlas con Ajax. Una de las validaciones que quiero hacer es, verificar si ...
  #1 (permalink)  
Antiguo 02/03/2016, 07:25
 
Fecha de Ingreso: abril-2013
Mensajes: 3
Antigüedad: 8 años, 7 meses
Puntos: 0
Detener envio de formulario con Ajax

Hola!

Estoy realizando las validaciones de un formulario de registro y quiero hacerlas con Ajax. Una de las validaciones que quiero hacer es, verificar si en la base de datos está el email que el usuario quiere registrar, si éste existe ahí nomas le sale una notificación (en el div #info_error) que ese mail no esta disponible y si esta disponible no notifica nada.

Éste es el codigo del formulario:

Código HTML:
<form id="registerForm" class="registerForm" method="POST">
        <ul>            
            <li>
                <label for="registerEmail">*Email:</label><div id="info_error"></div>                
                <input id="registerEmail" class="" type="email" name="email" required>                 
            </li>
            <li><label for="registerPass">*Contraseña:</label>
                <input id="registerPass"  class="" type="password" name="pass" minlength="5" required>
            </li>
        </ul>
        <button id="registerBtn" type="submit">Registrarse</Button>
</form> 
Aquí el Ajax:

Código Javascript:
Ver original
  1. $(document).ready(function() {
  2.    $('#registerEmail').blur(function(e){
  3.        
  4.         var email = $('#registerEmail').val();    
  5.        
  6.         var dataString = '&email='+email;
  7.  
  8.         $.ajax({
  9.             type: "POST",
  10.             url: "ajax/email_existense.php",
  11.             data: dataString,          
  12.             success: function(resp){
  13.                 if(resp == 1){
  14.                     $('#registerEmail').on('focus', function(){
  15.                         $('#info_error').hide().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');
  16.                     });                    
  17.                     $('#info_error').show().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');    
  18.                    
  19.                     $("#registerForm").submit(function(){
  20.                         return false;                        
  21.                     })
  22.                
  23.                 }else{
  24.                    
  25.                     $("#registerForm").submit(function(){
  26.                         return true;                        
  27.                     })
  28.                 }
  29.                
  30.             }            
  31.         });
  32.     });
  33. });

Y aqui el código php donde verifico si el mail esta en la base de datos o no.

Código PHP:

if($_POST) {          
   
$email $_POST['email'];
}

$sql "SELECT email FROM users WHERE email = '$email'";

$result dbquery($sql);                

if(
dbgetNumRows($result) > 0){
            
   echo 
1;
                            
}else{
               
  echo 
0;


Bien!. He aquí el problemilla que tengo. Primero aclaro que soy principiante en Javascript y Ajax, pero de problemas se aprende, . Lo que quiero hacer, básicamente, es que si el email existe en la base de datos el formulario no se envíe y si no existe que se envíe normalmente.

Entonces, si el email que el usuario ingresa no esta registrado en la base de datos, el php devuelve un cero, pasa al Ajax y el .submit() me da un true y manda el formulario.

Hasta ahí, todo bien, funciona. Pero, cuando el email esta registrado en la base de datos, el php devuelve un uno y Ajax manda la notificación diciendo que el email esta registrado y el .submit() da un false y no se envia el formulario. EL PROBLEMA, es que al cambiar en ese momento el email por uno válido, que no este en la BD, se borra la notificación correctamente, peeeero no me deja enviar el formulario, es como que el .submit() sigue siendo falso, por mas que el php haya devuelto cero en ese momento.

La parte de conexion a la BD y el INSERT lo hago en otros archivos php aparte.

Seguramente estoy haciendo algo mal con el .submit(). Si alguien es tan amable de darme una mano con este tema se lo agradecería a montones .

Desde ya muchisimas gracias por su tiempo, un gran saludo!
  #2 (permalink)  
Antiguo 02/03/2016, 08:49
 
Fecha de Ingreso: octubre-2010
Ubicación: España
Mensajes: 1.007
Antigüedad: 11 años, 1 mes
Puntos: 123
Respuesta: Detener envio de formulario con Ajax

Intenta hacerle un trim a la respuesta para eliminar que pueda tener algún espacio y que de hay que la comparación siga siendo falsa

Código Javascript:
Ver original
  1. resp = $.trim(resp);
  #3 (permalink)  
Antiguo 02/03/2016, 13:06
 
Fecha de Ingreso: abril-2013
Mensajes: 3
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: Detener envio de formulario con Ajax

Muchas gracias por el aporte Xerifandtomas. Logre solucionarlo de la siguiente manera:

Quite los .submit() y lo que hice fue desactivar el boton submit con $("#idBtn").attr("disabled", true), para cuando el php me devuelve un uno, osea el email está registrado en la BD, y para cuando esta disponible el email utilizo $("#idBtn").removeAttr("disabled"), ambos dentro de la sentencia if.

Osea, el codigo viejo era:

Código Javascript:
Ver original
  1. if(resp == 1){
  2.    $('#registerEmail').on('focus', function(){
  3.    $('#info_error').hide().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');
  4.     });                    
  5.     $('#info_error').show().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');    
  6.                    
  7.     $("#registerForm").submit(function(){
  8.        return false;                        
  9.     })
  10.                
  11.     }else{
  12.                    
  13.     $("#registerForm").submit(function(){
  14.        return true;                        
  15.     })
  16. }

El nuevo quedó de la siguiente manera:

Código Javascript:
Ver original
  1. if(resp == 1){
  2.    $('#registerEmail').on('focus', function(){
  3.    $('#info_error').hide().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');
  4.    });                    
  5.    $('#info_error').show().html('<div id="email_not_enable">Email ya registrado. <a href="index.php?page=login">Inicia Sesión</a></div>');    
  6.                    
  7.    $("#registerBtn").attr("disabled", true);
  8.                
  9.    }else{          
  10.                    
  11.    $("#registerBtn").removeAttr("disabled");
  12.                    
  13.    }

Espero que esto le sea de utilidad a todos y si alguien tiene algo mas para aportar y mejorar el código, bienvenido sea. Muchas gracias y saludos!

Etiquetas: ajax, ajax-php-mysql, formulario-php, javascript, submit
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 23:16.