Webmaster : Vérifier un pseudo en direct

Un article de Sur-la-Toile.

Programmation

Cet exemple d'AJAX permet dans un formulaire de vérifier en direct une information, ici si un pseudo est disponible. Cet exemple est issu de la page Editeurjavascript.com.

Créer une page pseudo.php :

<?
#Vérification du pseudo
# CONNECION SQL
mysql_connect("localhost", "user", "password");
mysql_select_db("base");
#Vérification
$result = mysql_query("SELECT pseudo FROM membres WHERE pseudo='".$_GET["pseudo"]."'");
if(mysql_num_rows($result)>=1)
echo "1";
else
echo "2";
?>

Création de la page formulaire.php

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title>AJAX</title>
<script type="text/javascript">
function writediv(texte)
{
document.getElementById('pseudobox').innerHTML = texte;
}

function pseudo(pseudo)
{
if(pseudo != '')
{
if(pseudo.length<2)
writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop court</span>');
else if(pseudo.length>30)
writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est trop long</span>');
else if(texte = file('http://www.monsiteweb/a/remplacer/pseudo.php?pseudo='+escape(pseudo)))
{
if(texte == 1)
writediv('<span style="color:#cc0000"><b>'+pseudo+' :</b> ce pseudo est deja pris</span>');
else if(texte == 2)
writediv('<span style="color:#1A7917"><b>'+pseudo+' :</b> ce pseudo est libre</span>');
else
writediv(texte);
}
}
}

function file(fichier)
{
if(window.XMLHttpRequest) // FIREFOX
xhr_object = new XMLHttpRequest();
else if(window.ActiveXObject) // IE
xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
else
return(false);
xhr_object.open("GET", fichier, false);
xhr_object.send(null);
if(xhr_object.readyState == 4) return(xhr_object.responseText);
else return(false);
}
</script>
</head>
<body>
<form action="">
<input type="text" name="pseudo" onKeyUp="pseudo(this.value)" />
<div id="pseudobox"></div>
</form>
</body>
</html>