Ver Mensaje Individual
  #1 (permalink)  
Antiguo 20/06/2012, 20:36
Avatar de MLDGATO
MLDGATO
 
Fecha de Ingreso: marzo-2011
Ubicación: Guatemala
Mensajes: 113
Antigüedad: 14 años
Puntos: 2
Pregunta Validar contraseñas en dos input con Ajax

Amigos nuevamente vengo a pedir de su ayuda necesito hacer que en un formulario de registro de usuarios al momento de que el usuario escriba su contraseña y la vuelva a escribir en otro input que aparezca un mensaje indicando si lñas dos contraseñas son iguales o si son diferentes. este es el código que tengo:

Primero el HTML

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  4. <title>Registro de Usuarios</title>
  5. <link href="Estilos.css" rel="stylesheet" type="text/css" />
  6. <script type="text/javascript" src="validar.js"></script>
  7. </head>
  8. <div id="Contenedor">
  9.   <form id="form1" name="form1" method="post" action="">
  10.     <table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
  11.       <tr>
  12.         <td colspan="2" align="center" bgcolor="#B0C4DE" class="redondosSombra"><h1>REGISTRO DE USUARIOS</h1></td>
  13.       </tr>
  14.       <tr>
  15.         <td width="400">&nbsp;</td>
  16.         <td width="400">&nbsp;</td>
  17.       </tr>
  18.       <tr>
  19.         <td><p>
  20.           <label for="nombres">Nombres:</label>
  21.           </p>
  22.           <p>
  23.             <input name="nombres" type="text" class="redondos" id="nombres" size="50" />
  24.         </p></td>
  25.         <td align="center" valign="middle">&nbsp;</td>
  26.       </tr>
  27.       <tr>
  28.         <td><p>
  29.           <label for="apellidos">Apellidos:</label>
  30.           </p>
  31.           <p>
  32.             <input name="apellidos" type="text" class="redondos" id="apellidos" size="50" />
  33.         </p></td>
  34.         <td align="center" valign="middle">&nbsp;</td>
  35.       </tr>
  36.       <tr>
  37.         <td><p>
  38.           <label for="email">Email:</label>
  39.           </p>
  40.           <p>
  41.             <input name="email" type="email" class="redondos" id="email" size="50" onkeyup="correo(this.value)" />
  42.         </p></td>
  43.         <td align="center" valign="middle"><span id="ErrorEmail"></span></td>
  44.       </tr>
  45.       <tr>
  46.         <td><p>
  47.           <label for="user">Usuario:</label>
  48.           </p>
  49.           <p>
  50.             <input name="user" type="text" class="redondos" id="user" size="50" onkeyup="usuarios(this.value)" />
  51.         </p></td>
  52.         <td align="center" valign="middle"><span id="ErrorUser"></span></td>
  53.       </tr>
  54.       <tr>
  55.         <td><p>
  56.           <label for="pass">Contrasena:</label>
  57.           </p>
  58.           <p>
  59.             <input name="pass" type="password" class="redondos" id="pass" size="50" onblur="pass1(this.value)" />
  60.         </p></td>
  61.         <td align="center" valign="middle">&nbsp;</td>
  62.       </tr>
  63.       <tr>
  64.         <td><p>
  65.           <label for="pass2">Repetir Contrasena:</label>
  66.           </p>
  67.           <p>
  68.             <input name="pass2" type="password" class="redondos" id="pass2" size="50" onkeyup="pass2(this.value)" />
  69.         </p></td>
  70.         <td align="center" valign="middle"><span id="ErrorPass"></span></td>
  71.       </tr>
  72.       <tr>
  73.         <td>&nbsp;</td>
  74.         <td>&nbsp;</td>
  75.       </tr>
  76.       <tr>
  77.         <td align="right"><input name="button" type="submit" class="redondos" id="button" value="Enviar" size="50" /></td>
  78.         <td>&nbsp;</td>
  79.       </tr>
  80.     </table>
  81.   </form>
  82. </div>
  83. </body>
  84. </html>

como ven tengo dos inputs tipo password el primero al hacer onblur llama a una funcion pass1(this.value) y el otro input al hacer onkeyup llama una funcion pass2(this.value)

dichas funciones son las siguientes:

Código Javascript:
Ver original
  1. function pass1(pasword1){
  2.         var newpass1;
  3.         if(pasword1.length==0){
  4.             document.getElementById("ErrorPass").innerHTML="";
  5.             return;
  6.         }
  7.         if (window.XMLHttpRequest){
  8.             newpass1=new XMLHttpRequest();
  9.         }else{
  10.             newpass1=new ActiveXObject("Microsoft.XMLHTTP");
  11.         }
  12.          newpass1.onreadystatechange=function(){
  13.             if (newpass1.readyState==4 && newpass1.status==200){
  14.                 document.getElementById("ErrorPass").innerHTML=newpass1.responseText;
  15.             }
  16.         }
  17.        
  18.         newpass1.open("GET","pass.php?verificarPass1="+pasword1,true);
  19.         newpass1.send();
  20. }
  21.  
  22. function pass2(pasword2){
  23.         var newpass2;
  24.         if(pasword2.length==0){
  25.             document.getElementById("ErrorPass").innerHTML="";
  26.             return;
  27.         }
  28.         if (window.XMLHttpRequest){
  29.             newpass2=new XMLHttpRequest();
  30.         }else{
  31.             newpass2=new ActiveXObject("Microsoft.XMLHTTP");
  32.         }
  33.          newpass2.onreadystatechange=function(){
  34.             if (newpass2.readyState==4 && newpass2.status==200){
  35.                 document.getElementById("ErrorPass").innerHTML=newpass2.responseText;
  36.             }
  37.         }
  38.        
  39.         newpass2.open("GET","pass.php?verificarPass2="+pasword2,true);
  40.         newpass2.send();
  41. }

Ambas funciones envía las variables a pass.php y este es el código:

Código PHP:
Ver original
  1. $pass = "";
  2.     $pass2 = "";
  3.    
  4.     if(@$_GET['pasword1']!="" && @$_GET['pasword2']!=""){
  5.         $pass = $_GET['pasword1'];
  6.         $pass2 = $_GET['pasword2'];
  7.         if($pass == $pass2){
  8.             echo "La Contrasena Coincide";
  9.         }else{
  10.             echo "Error No Coincide la Contrasena";
  11.         }
  12.     }

Espero ser entendido muchas gracias.