954,597 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

username availability gmail-style (javascript+sql)

Hi all.
I am currently developing a CMS for a school project and I wanted to add the function to check, real-time, if a username is already taken. It should be a little bit like what happens when you register for a Gmail or Yahoo! account.
Basically, while the user inputs the desired username in a textbox, I want to make appear next to it a green or red sign (plus a small text) to display availability.
The registered usernames will be in a mysql table which I can query with a very basic SELECT statement.

It should work AS THE USER TYPES, so if he's entering "mrbrown" then it should try to query for every letter.
This will be my first AJAX implementation, so I am asking for a starting point and any suggestion you deem could help me.

Thanks!

trashed
Light Poster
30 posts since Oct 2004
Reputation Points: 11
Solved Threads: 0
 

Th JavaScript code for this will be similar to: (You will need to modify this)

<script type="text/javascript">
function createRequestObject() {
	var ro;
	var browser = navigator.appName;
	if(browser == "Microsoft Internet Explorer") {
		ro = new ActiveXObject("Microsoft.XMLHTTP");
	}else {
		ro = new XMLHttpRequest();
	}
	return ro;
}
var http = createRequestObject();
function sndReq(action) {
	if(action.length < 3) {
		if(action.length == 0) {
			document.getElementById('usernamecheck').innerHTML = "";
			return false;
		}
		document.getElementById('usernamecheck').innerHTML = "Username too short";
		return false;
	}else { 
		http.open('get', 'rpc.php?action='+action);
		http.onreadystatechange = handleResponse;
		http.send(null);
	}
}
  function handleResponse() {
	if(http.readyState == 4) {
		var update = http.responseText;
     		if(update!="This name is Avaliable!") {
			document.getElementById('usernamecheck').innerHTML = "This name is unavaliable, please try again";
		}else {
			document.getElementById('usernamecheck').innerHTML = "<a href='Javascript:EnableDisable()'>"+update+" Click to change</a>";
		}
	}
}
</script>


HTML for the username box:

<input type="text" name="un" onchange="sndReq(this.value)">


And rpc.php

<?
	//connect to db first
	$user=mysql_query("SELECT * FROM user_table WHERE un = '".$_REQUEST['action']."'")or die(mysql_error());
	$countrows=mysql_num_rows($user);
	if($countrows > 0) {
		echo "This name is Unavaliable";
	}
	else {
		echo"This name is Avaliable!";
	}
?>


Note, the PHP code if not good, there is no checking for bad data so it is not secure, just an example

Will Gresham
Master Poster
755 posts since May 2008
Reputation Points: 96
Solved Threads: 125
 

This article has been dead for over three months

Post: Markdown Syntax: Formatting Help
You