Comprobar si el nombre de usuario existe con jQuery y PHP
Para comprobar durante el proceso de registro si el nombre de usuario está disponible, todo esto sin recargar la página, podemos utilizar el siguiente código:
- Primero vamos con el código del archivo que contiene el formulario de registro:
jQuery
$(document).ready(function(){
var consulta;
//hacemos focus
$("#usuario").focus();
//comprobamos si se pulsa una tecla
$("#usuario").keyup(function(e){
//obtenemos el texto introducido en el campo
consulta = $("#usuario").val();
//hace la búsqueda
$("#resultado").delay(1000).queue(function(n) {
$("#resultado").html('<img src="ajax-loader.gif" />');
$.ajax({
type: "POST",
url: "comprobar.php",
data: "b="+consulta,
dataType: "html",
error: function(){
alert("error petición ajax");
},
success: function(data){
$("#resultado").html(data);
n();
}
});
});
});
});
HTML
<input type="text" id="usuario" /> <div id="resultado"></div>
- Por último vamos con el código del archivo PHP que comprueba si el usuario existe:
<?php
$user = $_POST['b'];
if(!empty($user)) {
comprobar($user);
}
function comprobar($b) {
$con = mysql_connect('localhost','root', 'root');
mysql_select_db('masajes', $con);
$sql = mysql_query("SELECT * FROM usuarios WHERE nombre = '".$b."'",$con);
$contar = mysql_num_rows($sql);
if($contar == 0){
echo "<span style='font-weight:bold;color:green;'>Disponible.</span>";
}else{
echo "<span style='font-weight:bold;color:red;'>El nombre de usuario ya existe.</span>";
}
}
?>
Podéis descargar imágenes de carga para Ajax usando de este generador online: