Check username availability using PHP and jQuery

Today we’ll show you how to check username availability using PHP and jQuery. Generally we need to check if a username or email already exists or not during the registration process without submitting a form. So in this article, we will explain to you how we can check if a username is available or not using jQuery, Ajax and PHP.

check username exists php, Live Username Availability Check using PHP and jQuery AJAX, JQuery – Username Availability Validation using PHP and MySQL, How to Implement Check Username Availability Feature With AJAX & JQuery, username already exists validation in jquery, check if user already exists without submitting form, how to check if email already exists in database using jquery, how to check if email already exist in database without refreshing page, check if username is taken php.

In this article we will take an example that contains a simple textbox for username. That textbox has an onblur event to validate the inserted username when the cursor leaves the textbox field. We will check the records in the database by calling the ajax request in background and display the appropriate message.

Steps to check username availability in PHP

  1. Create table in database
  2. Database connection
  3. Include jQuery and Bootstrap library
  4. Create HTML Form
  5. Add jQuery Code
  6. Write PHP Code
  7. Output

1. Create table in database

First, Run the following script to create a table in the database.

2. Database connection

We have to create a file for database connection named connection.php.

connection.php

3. Include jQuery and Bootstrap library

It’s time to create a HTML, so first we have to include the following jQuery and Bootstrap libraries in the head section of the page. jQuery will be used to work with Ajax call and for the styling bootstrap library will be added to the form.

4. Create HTML Form

Now let’s create a simple form that contains an input text field for username and div#uname_result to display ajax response.

For demo purposes, we have taken only a single field but you can use the same logic in your real project.

5. Add jQuery Code

Finally, we have to add jQuery code to handle the blur event of the input field. So when blur event trigger, send ajax request to username_checker.php file and shown response in the div#uname_result section.

6. Write PHP Code

Let’s create an username_checker.php file to check the username available or not from ajax call and return a suitable message.

username_checker.php

7. Output

Let’s combine all HTML code together in an index.php file and check the output.

index.php

Output - Check Username availability using PHP and jQuery - Clue Mediator
Output – Check username availability using PHP and jQuery – Clue Mediator

That’s it for today.
Thank you for reading. Happy Coding..!!

Demo & Source Code

Github Repository
If you found value in this article,
you can support us by buying me a coffee! ☕

You may also like...

2 Responses

  1. wzsajid says:

    Thank you, its working and very useful!!

Leave a Reply

Your email address will not be published. Required fields are marked *