<input type='text' id='username'> <input type='button' id='check_username_availability' value='Check Availability'>
<div id='username_availability_result'></div>

//connect to database
mysql_connect('host', 'user', 'pass');
mysql_select_db('database_name');

//get the username
$username = mysql_real_escape_string($_POST['username']);

//mysql query to select field username if it's equal to the username that we check '
$result = mysql_query('select username from users where username = "'. $username .'"');

//if number of rows fields is bigger them 0 that means it's NOT available '
if(mysql_num_rows($result)>0){
	//and we send 0 to the ajax request
	echo 0;
}else{
	//else if it's not bigger then 0, then it's available '
	//and we send 1 to the ajax request
	echo 1;
}

$(document).ready(function() {

		//the min chars for username
		var min_chars = 3;

		//result texts
		var characters_error = 'Minimum amount of chars is 3';
		var checking_html = 'Checking...';

		//when button is clicked
		$('#check_username_availability').click(function(){
			//run the character number check
			if($('#username').val().length < min_chars){
				//if it's bellow the minimum show characters_error text '
				$('#username_availability_result').html(characters_error);
			}else{
				//else show the cheking_text and run the function to check
				$('#username_availability_result').html(checking_html);
				check_availability();
			}
		});

  });

//function to check username availability
function check_availability(){

		//get the username
		var username = $('#username').val();

		//use ajax to run the check
		$.post("check_username.php", { username: username },
			function(result){
				//if the result is 1
				if(result == 1){
					//show that the username is available
					$('#username_availability_result').html(username + ' is Available');
				}else{
					//show that the username is NOT available
					$('#username_availability_result').html(username + ' is not Available');
				}
		});

}

Comments

• Davide Imperato Nov 25th, 09

  Sorry is very useful this tutorial but if i want to have this check automatic could be possible? (without the checking button) beacuse i have seen all the other site that has this kind of tutorial but all said that you have to write a list of all the username that you have registered on you Database… That’s Impossible!!! Thanks for your reply
• Boba Nov 25th, 09

  No need to write any lists, the mysql query checks through the usernames inside the users table which is populated when someone signs up.

  If i understand correctly, you want the username check to be fired automatically, so here is how to make it start when someone types in something.

  Just change the

  $(‘#check_username_availability’).click(function(){ …

  into

  $(‘#username’).keyup(function(){ …
• Techie Talks Dec 9th, 09

  Cool posting. This username check is one of the easiest I see online. Thanks!
• Boba Dec 9th, 09

  You’re welcome
• bak Feb 3rd, 10

  Thank you so much for this amazing tutorial. However, it did not work for me with Mozilla, I always got user is not available. I tried it in IE and it worked. So, I am going to try and fix function check_availability() in the index.html. I will let u know if I arrive at something.
• bak Feb 3rd, 10

  I figured it out. It was not running on Mozilla b.c. I ran it as a file (file:///C:/xampp/htdocs/forms/Check%20User/index.html) rather than a web site (http://localhost/forms/Check%20User/index.html). Really stupid mistake
• Tsalagi Feb 28th, 10

  I have a few issues that I’m not sure how to fix.
  When I fire up my form I get a notice “Notice: Undefined index: user_name in”
  in this line [CODE]$username = mysql_real_escape_string($_POST['user_name']);[/CODE]
• Tsalagi Feb 28th, 10

  Here is the second issue. The form connects to the ajax file but returns a 1 for every entry I try. The table is empty so the name should be available. Can you explain maybe what I’m doing wrong. The connection to my database is good.
  Thanks
• Amol Nirmala Waman Mar 2nd, 10

  Some suggestions and solutions:
  ====================
  1. Resolve jQuery conflicts:
  jq = jQuery.noConflicts();
  jq(document).ready(function(){
  }

  and replace each ‘$’ with ‘jq’.

  2. Other events:
  Use ‘click/keyup/blur’ events on the ‘username’ field itself to have minimum fields

  3. Use instead

  4. PHP – MySQL:
  Select username from table
  $result = mysql_fetch_array(mysql_query(“SELECT username FROM users”));

  # if number of rows fields is bigger than 0 that means it’s NOT available

  Use – if($username == $result['username']) – instead – if(mysql_num_rows($result) > 0)

  ———————————
  @ Tsalagi – I am 100% sure this will solve your problem
• Tedah Apr 17th, 10

  I’m a complete novice on jquery, exactly where should I paste that code? Is it pasted into the html page or the php page and where exactly on the page should it be placed? Thanks.
• Tedah Apr 19th, 10

  I understand now, I had to go to jquery.com to figure it out.
• Tedah Apr 19th, 10

  Will someone please explain to me about the User section where it says that it must be changed to accomodate the server because I don’t see a place in the code that gives me a place to designate the MySQL database name?
• Kim brännlund Apr 19th, 10

  Tedah: “I don’t see a place in the code that gives me a place to designate the MySQL database name?”

  First lines ->

  //connect to database
  mysql_connect(‘host’, ‘user’, ‘pass’);
  mysql_select_db(‘database_name’); <– database name ??

  Very hard to miss.
• Yammer Apr 20th, 10

  Novis here! I cannot get this to work. Would someone be willing to take alook at my DB set up to see if it is correct?

  Thanks
• Tedah Apr 20th, 10

  I’m talking about the area above the JQUERY that lists the six things in the code that need to be modified, specifically “users(mysql db table name)”.
• Tedah Apr 20th, 10

  The other problem I’m having with this code is, I’m a complete novice and there are no instructions as to where to paste/insert the code such as in the head, body, or in a js page/file and whether or not the page(s) need to be named something particular. Help! Thanks.
• nancy Jul 31st, 10

  yeah…its really working…
  thanx 4 posting it.
• Mansh Oct 20th, 10

  Really nice post…thank you
• Tsrlinkan Nov 2nd, 10

  Thanks for the stuff dude
• Sebastian Jan 20th, 11

  Very Nice script, thank you very much.
• David Drumm Mar 10th, 11

  Lovely! Works a charm.

  Thanks buddy.
• Sam May 2nd, 11

  Works like a charm with ASP.NET MVC. Thanks
• dexter Aug 4th, 11

  Very nice script! thx

Leave your own!

Your Name

Email

Website

Comment