$(document).ready(function()
{
	$("#fld_user_name").blur(function()
	{   
		//remove all the class add the messagebox classes and start fading
		$("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
		//check the username exists or not from ajax
		$.post("user_availability.php",{ user_name:$(this).val() } ,function(data)
        { 
		   var userDataget=document.getElementById('fld_user_name');
	    // Checking the filling of the data by the user
		if(userDataget.value==""){
			
			userDataget.focus();
			$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
					{ 
					  //add message and change the class of the box and start fading
					  $(this).html('Please fill the blank field <br>for  checking  the <br> user name availability').addClass('messageboxerror').fadeTo(900,1);	
					});
		  
		}
		else{
				  if(data=='no') //if username not avaiable
				  {  
				       userDataget.value=="";
					   userDataget.focus();
					$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
					{ 
					  //add message and change the class of the box and start fading
					  $(this).html('Username already<br> exists,please choose<br> another').addClass('messageboxerror').fadeTo(900,1);
					});		
				  }
				  else
				  {
					$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
					{ 
					  //add message and change the class of the box and start fading
					  $(this).html('Username available <br> to register').addClass('messageboxok').fadeTo(900,1);	
					});
				  }
		   }		
        });
 
	});
});