• About Sarwar
  • Portfolio
  • আমার বাংলা

sarwar's weblogs

~ story of web applications…..

sarwar's weblogs

Tag Archives: availability

check username availability on keypress using jquery

26 Wednesday May 2010

Posted by Sarwar in Ajax, JavaScript, jquery, PHP

≈ 3 Comments

Tags

ajax, availability, jquery, keypress, keyup, validation


Username or email availability or any other types of availability check we can do in this way. When user type on a text box an ajax request has made and check what if its available or not.  we only required jquery.js

HTML CODE:

<input name="username" type="text" id="username" />
<label id="user_msg" style="color:#CC0000;"></label>

Javascirpt:

$(document).ready(function() {

		var timeOut = null;	// this used for hold few seconds to made ajax request

		var loading_html = '<img src="ajax-loader.gif" />'; // just an loading image or we can put any texts here

		//when button is clicked
		$('#username').keyup(function(e){

			// when press the following key we need not to make any ajax request, you can customize it with your own way
			switch(e.keyCode)
			{
				//case 8:   //backspace
				case 9:		//tab
				case 13:	//enter
				case 16:	//shift
				case 17:	//ctrl
				case 18:	//alt
				case 19:	//pause/break
				case 20:	//caps lock
				case 27:	//escape
				case 33:	//page up
				case 34:	//page down
				case 35:	//end
				case 36:	//home
				case 37:	//left arrow
				case 38:	//up arrow
				case 39:	//right arrow
				case 40:	//down arrow
				case 45:	//insert
				//case 46: 	//delete
					return;
			}
			if (timeOut != null)
			    clearTimeout(ajaxCallTimeoutID);
			timeOut = setTimeout(is_available, 1000);  // delay delay ajax request for 1000 milliseconds
			$('#user_msg').html(loading_html); // adding the loading text or image
		});
  });
function is_available(){
	//get the username
	var username = $('#username').val();

	//make the ajax request to check is username available or not
	$.post("availability.php", { username: username },
	function(result)
	{
		if(result != 0)
		{
			$('#user_msg').html('Not Available');
		}
		else
		{
			$('#user_msg').html('<span style="color:#006600;">Available</span>');
		}
	});

}

PHP: Put your way to searching, you can make any array search or you can check it from database or flat file. I check it from database here is the code

<?php
mysql_connect('localhost', 'root', '');
mysql_select_db('db_name');
$username = mysql_real_escape_string($_POST['username']);
$result = mysql_query('select username from user_table where username = "'. $username .'"');
$cnt = mysql_num_rows($result);
print($cnt);
?>

Its work with me very well 🙂

Share this:

  • Tweet
  • Email

Like this:

Like Loading...

Author

  • Sarwar

Categories

  • .htaccess
  • Apache
  • API
  • CSS
  • Debug
  • Framework
    • CakePHP
  • HTML
  • JavaScript
    • Ajax
    • ckeditor
    • jquery
    • jQuery UI
    • tinymce
  • Joomla
    • Virtumart
  • Linux
  • MySQL
  • PHP
  • SVN
  • Twitter
  • WHM/cPanel
View Sarwar Hossain's profile on LinkedIn
Follow bdsarwar on Twitter

Tweets

  • “Running a small business without a plan is a lot like driving without directions.” — @GoldmanSachs via @appexchange    4 years ago
  • RT @TechCrunch: 5K people turn up to catch Pokémon in Chicago tcrn.ch/2aaLRys https://t.co/VVQSd7nmN4    4 years ago
  • linkedin.com/slink?code=eZ2… @ibneha, @mdthanvirahmed, @shafi_aszad, @ashrafulkauser, @digitalstatusbd, @eternolimited, @mamunha34354847    4 years ago
  • linkedin.com/slink?code=eYt… @html50, @bdwasif, @81faabfaa6f34a8, @saimonsajid, @voipworldcalls, @sarwar31945, @tomamuns    4 years ago
  • linkedin.com/slink?code=ewd… @ataharhh, @shariful51, @akhtar_h, @litetechno, @tahsin_wsit, @noormd25522880, @abmukid11    4 years ago
  • linkedin.com/slink?code=ewA… @solamanraji, @mycomplain, @washimk118_s, @audacity_it_ltd, @jibonbikash, @salimshalimm784, @mukul_politeboy    4 years ago

Flickr Photos

From Helipad ViewAbove the CloudHillNear to SkySunset Moment#sunset #beach #ocean #coxsbazar#jamroll #food #deliciousfood #homemade  #homemadefood#seaside #ocean #oceanview #travelphotography #coxsbazar #bayofbengal #travel #longestbeach#beach #lifeguard #seaside #holiday #tour #longestbeach #travel #travelphotography #coxsbazar #bayofbengal#resort #mountains
More Photos

Archives

  • February 2012 (1)
  • January 2012 (2)
  • August 2011 (1)
  • July 2011 (1)
  • June 2011 (2)
  • May 2011 (2)
  • April 2011 (1)
  • March 2011 (3)
  • December 2010 (3)
  • November 2010 (1)
  • October 2010 (4)
  • September 2010 (1)
  • June 2010 (1)
  • May 2010 (2)
  • April 2010 (1)
  • March 2010 (1)
  • January 2010 (2)
  • July 2009 (1)
  • January 2009 (1)
  • August 2008 (1)

Recent Comments

  • SolkAgoks on quick setup of Auth Component for CakePHP 2.0
  • Kush on how to cakephp in a sub-directory, access it from root using .htaccess
  • CharlesLaula on Drag and Drop dashboard using jquery and save state of each change
  • ror on set & reset form text value onfocus, onblur, onclick using javascript
  • Mr Griever on Access session data in a model -cakephp
  • RSS - Posts
  • RSS - Comments

Meta

  • Register
  • Log in
  • Entries feed
  • Comments feed
  • WordPress.com

Create a free website or blog at WordPress.com.

loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.
Privacy & Cookies: This site uses cookies. By continuing to use this website, you agree to their use.
To find out more, including how to control cookies, see here: Cookie Policy
%d bloggers like this: