Ajax Username Validation with The Most Popular JS Frameworks

Filed under HTML, Javascript, PHP

It seems like every site these days uses some form of Ajax to validate form fields. One thing I cannot stand is websites that do not use Ajax to check usernames (or other data) as you type. Because a lot of sites are lacking this one feature, I thought it would be nice to throw together a few examples of how to do it correctly with the most popular of JS frameworks.

You can view the source of the examples to see how they are done.

Ajax Username Validation with Prototype
Ajax Username Validation with jQuery

note: more examples will come in time. I am currently reading the mootools, dojo, and mochikit.

The only PHP code you will need is as follows:

include("../db.php");
$name = ereg_replace("[^A-Za-z0-9-]", "",mysql_real_escape_string(strip_tags(trim($_GET['name']))));
if(empty($name)) die();

$sql = "SELECT `username` FROM `common_usernames` WHERE `username` = '$name'";
$query = mysql_query($sql,$db);

if(!mysql_num_rows($query))
{
	die('<span style="font-weight:bold;color:green;font-size:12px;">'.$name.' is available!</span>');
}
else
{
	die('<span style="font-weight:bold;color:red;font-size:12px;">'.$name.' is taken!</span>');
}

| May 23, 2008