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: