index.php
Código:
function nuevoAjax()
{
/* Crea el objeto AJAX*/
var xmlhttp=false;
try
{
// Creacion del objeto AJAX para navegadores no IE
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
// Creacion del objet AJAX para IE
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(E) { xmlhttp=false; }
}
if (!xmlhttp && typeof XMLHttpRequest!="undefined") { xmlhttp=new XMLHttpRequest(); }
return xmlhttp;
}
function eliminaEspacios(cadena)
{
// Funcion equivalente a trim en PHP
var x=0, y=cadena.length-1;
while(cadena.charAt(x)==" ") x++;
while(cadena.charAt(y)==" ") y--;
return cadena.substr(x, y-x+1);
}
function validaIngreso(valor)
{
/* Funcion encargada de validar lo ingresado por el usuario. Se devuelve TRUE en caso de ser
valido, FALSE en caso contrario */
var reg=/(^[a-zA-Z0-9.@ ]{4,40}$)/;
if(reg.test(valor)) return true;
else return false;
}
function nuevoEvento(evento)
{
// Obtengo el div donde se mostraran las advertencias y errores
var divMensaje=document.getElementById("error");
/* Dependiendo de cual sea el evento que ejecuto esta funcion (ingreso o verificacion) se setean
distintas variables */
if(evento=="ingreso")
{
var input=document.getElementById("ingreso");
// Boton presionado
var boton=document.getElementById("botonIngreso");
// Valor ingresado por el usuario
var valor=input.value;
// Texto a colocar en el input mientras se esta cargando la respuesta del servidor
var textoAccion="Ingresando...";
}
else
{
var input=document.getElementById("verificacion");
// Boton presionado
var boton=document.getElementById("botonVerificacion");
// Valor ingresado por el usuario
var valor=input.value;
// Texto a colocar en el input mientras se esta cargando la respuesta del servidor
var textoAccion="Comprobando...";
}
// Elimino espacios por delante y detras de lo ingresado por el usuario
valor=eliminaEspacios(valor);
// Si el ingreso es invalido coloco un mensaje de error en la capa correspondiente
if(!validaIngreso(valor))
{
divMensaje.innerHTML="El texto ingresado contiene caracteres o longitud inválida";
}
else
{
// Deshabilito inputs y botones para evitar dobles ingresos
boton.disabled=true; input.disabled=true;
input.value=textoAccion;
// Creo la conexion con el servidor y le envio la variable evento (que le indica si debe ingresar o verificar) y el dato a utilizar
var ajax=nuevoAjax();
ajax.open("POST", "comprobar_disponibilidad_de_apodo_proceso.php", true);
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send(evento+"="+valor);
ajax.onreadystatechange=function()
{
if (ajax.readyState==4)
{
// Habilito nuevamente botones e inputs
input.value="";
boton.disabled=false; input.disabled=false;
// Muestro el mensaje enviado desde el servidor
divMensaje.innerHTML=ajax.responseText;
}
}
}
}
...sigue tu código HTML...
acá llamas a tu función en el form de esta misma página:
<input type="text" id="verificacion">
button type="button" id="botonVerificacion" onclick="nuevoEvento('verificacion')">Comprobar</button>
comprobar_disponibilidad_de_apodo_proceso.php
Código PHP:
<?php
include '../include/conexion.php';
function validaIngreso($valor)
{
// Funcion utilizada para validar el dato a ingresar recibido por POST
if(eregi("^[a-zA-Z0-9.@ ]{4,40}$", $valor)) return TRUE;
else return FALSE;
}
function verificaExistencia($apodo)
{
/* Funcion encargada de verificar la existencia del apodo recibido en base de datos. Devuelve TRUE si el apodo existe, FALSE de lo contrario */
$consulta=mysql_query("SELECT * FROM usuarios WHERE nick='$apodo'") or die(mysql_error());
$registro=mysql_fetch_row($consulta);
if(!empty($registro)) return TRUE;
else return FALSE;
}
if(isset($_POST["verificacion"]))
{
// Quito espacios en blanco al comienzo y fin de la cadena
$valor=trim($_POST["verificacion"]);
// Si el valor recibido es valido...
if(validaIngreso($valor))
{
//conectar();
// Si el apodo ya existe en base de datos...
if(verificaExistencia($valor)) echo "El nick: <strong>".$valor."</strong> ya existe en la base de datos, elija otro";
else echo "El nick: <strong>".$valor."</strong> esta disponible";
//desconectar();
}
}
?>
Este lo he probado y funciona de maravillas ... es el mismo ejemplo tuyo ...