How to check Username availability in php and MySQL using Ajax Jquery

Hi, If you are looking for web tutorial on how to check Username is available or not, So In this post, you can simple PHP script to check username availability using ajax in php with JQuery and Mysql. This type of feature is most common and you can see most of the available online website. This is very easy to understand and in this post we have write simple PHP Code that Live check username already exists or not by using PHP with Ajax.

Here when you have start registration then at that it will ask you username, so when you have enter username, at that time an Ajax function has called to server for check entered username is unique or not. At server side it will check into database and find entered username is available or not. After this it will send back to Ajax request regarding username availability or not and it will display result live without refreshing of page. So in simple word this tutorial is based on Ajax username validation in PHP. In this post you can also find live Demo and source code also.

Online Demo

username - mike

Live Username Available or not in PHP using Ajax Jquery

Enter Username

Enter Password

Source Code

index.php


<html>  
 <head>  
  <title>Live Username Available or not By using PHP Ajax Jquery</title>  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>  
  <style>  
  body  
  {  
   margin:0;  
   padding:0;  
   background-color:#f1f1f1;  
  }  
  .box  
  {  
   width:800px;  
   border:1px solid #ccc;  
   background-color:#fff;  
   border-radius:5px;
   margin-top:36px;  
  }  
  </style>  
 </head>  
 <body>  
  <div class="container box">  
   <div class="form-group">  
    <h3 align="center">Live Username Available or not By using PHP Ajax Jquery</h3><br />  
    <label>Enter Username</label>  
    <input type="text" name="username" id="username" class="form-control" />
    <span id="availability"></span>
    <br /><br />
    <button type="button" name="register" class="btn btn-info" id="register" disabled>Register</button>
    <br />
   </div>  
   <br />  
   <br />  
  </div>  
 </body>  
</html>  
<script>  
 $(document).ready(function(){  
   $('#username').blur(function(){

     var username = $(this).val();

     $.ajax({
      url:'check.php',
      method:"POST",
      data:{user_name:username},
      success:function(data)
      {
       if(data != '0')
       {
        $('#availability').html('<span class="text-danger">Username not available</span>');
        $('#register').attr("disabled", true);
       }
       else
       {
        $('#availability').html('<span class="text-success">Username Available</span>');
        $('#register').attr("disabled", false);
       }
      }
     })

  });
 });  
</script>

check.php


<?php  
//check.php  
$connect = mysqli_connect("localhost", "root", "", "testing"); 
if(isset($_POST["user_name"]))
{
 $username = mysqli_real_escape_string($connect, $_POST["user_name"]);
 $query = "SELECT * FROM users WHERE username = '".$username."'";
 $result = mysqli_query($connect, $query);
 echo mysqli_num_rows($result);
}
?>

Database


--
-- Database: `testing`
--

-- --------------------------------------------------------

--
-- Table structure for table `users`
--

CREATE TABLE IF NOT EXISTS `users` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(250) NOT NULL,
  `password` varchar(250) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=9 ;

--
-- Dumping data for table `users`
--

INSERT INTO `users` (`id`, `username`, `password`) VALUES
(1, 'mike', '5f4dcc3b5aa765d61d8327deb882cf99');

Webslesson

PHP, Node.js, React.js, MySql, Jquery, AngularJS, Ajax, Codeigniter, Laravel Tutorial

Monday, 1 February 2016