Javascript y ajax

JosephGalvezG · #1 (**permalink**) 23/07/2012, 15:16

Saludos amigos de forosdelweb

Tengo el siguiente problema, tratare de ser los mas breve explicando de que se trara. Resulta que tengo un ajax para comprobar la disponibilidad de usuarios, funciona perfecto devolviendo en un SPAN ID=comprobar mensaje el mensaje de "Este nick está ocupado" o "Nick libre" que corresponda, cree una funciona javascript por nombre HAB donde quiero que cuando el usuario vaya tecleando el nombre de usuario en el campo de texto se habilite o desabilite el boton de submit segun el mensaje que muestre nuestro SPAN, es decir
- Este nick está ocupado = boton desabilitado
- Nick Libre = boton habilitado

les adjunto mi codigo amigos

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>
</head>

<script src="prototype.js" type="text/javascript"></script> 
<script type="text/javascript">  
function comprobar(nick)   
{  
  var url = 'ajax_comprobar_nick.php';  
  var pars= ("nickname=" + nick);
  var myAjax = new Ajax.Updater( 'comprobar_mensaje', url, { method: 'get', parameters: pars});
 var mensaje= document.getElementById("comprobar_mensaje").innerHTML
}   
</script> 
<script language="javascript" type="text/javascript">
function hab(){
 var campo1 = document.getElementById('comprobar_mensaje').innerText;
 if (campo1 == "Nick libre"){
document.getElementById("button").removeAttribute('disabled');
}else{
  document.getElementById("button").setAttribute('disabled', 'disabled');     
  }
}
</script>

<body>
<form id="form1" name="form1" method="post" action="index.php">
<input name="nickname" id="username" onkeypress="hab(this.value)" onKeyUp="comprobar(this.value)"  /> <span id="comprobar_mensaje"></span>

<label>
<input type="submit" name="button" id="button" value="Enviar" disabled="disabled" />

</label>
<p>
  <label></label>
</p>
<p>&nbsp;</p>
</form>
</body>
</html>

les adjunto tambien mi codigo PHP aunque no fuese necesario quizas

Código PHP:

  <?php    
// Que no se nos olvide incluir nuestro fichero con la conexion a la base de datos.   
include("conec.php");  
$link=Conectarse();  
$nick=$_REQUEST['nickname'];   
$sql="SELECT nombre_cliente FROM clientes WHERE nombre_cliente='$nick'";   
$res=mysql_query($sql);   
$total=mysql_num_rows($res);   
if($total>0)   
{    
  // El usuario existe en la Base de Datos   
  echo "Este nick está ocupado"; 
}   
else   
{   
  // Ese nick esta libre   
  echo "Nick libre";   
}   
?>

maycolalvarez · #2 (**permalink**) 25/07/2012, 08:34

lo ideal es que lo hagas en el onreadystatechange, prototype debe de tener un equivalente.

además puedes tener todo el código en un solo bloque script, no necesitas uno para cada función