How to check if email already exists in database using Ajax in PHP
During user registration or signup, an email id or user id is the unique id we usually use to identify the user. So, we must check that the same email id or user id does not already exist in the database for another user during registration. If exists, we should give a message to the user. Using Ajax in PHP, we can show this message before the user submits the registration form.
In this topic, we will develop a small registration form where users can enter details along with the email id to register. We will show how you can write Ajax code to verify if the email id is already registered and give a message accordingly before the user submits the form.
You must have basic understanding of Ajax. You can read below topics for more details:
Step 1 - Create a MySQL table for user registration
Let us create a table named 'candidate' in MySQL database. This table will have candidate details, like name, email and gender etc. I have a database called 'demo'. So this Table will be created in demo database. If you have an existing database other than demo you can also use it. Just make sure same table name does not exist already. Table structure is given below:
Table has 5 columns in it.
candidate_id - It is the primary key and auto incremented id of the candidate
name - Name of the candidate
email_id - Email Id of the candidate
registration_date - Date of submission
gender - Gender of the candidate. Enum type with valiues Male, Female and Other.
Create table script for this table is given below, you can use this code to create the table. You can also download and get the scripts, download section is given later in this topic.
After you create the table, please verify if table structure is same as above. I am not inserting any data in the table initially. By submitting the form, data will be inserted in this table.
Step 2 - Connect to MySQL database (dbconnect.php)
Use below script to connect to the database. Note that we have this database connection php program in 'cfg' folder. This is written once and used in every program where database connection is needed. This will be easy for maintenance and also will enable reusability of the code.
I am using mysqli_connect() function which needs 4 parameters.
Here we will develop a registration form with 3 fields - name, email_id and gender. We are just using these three fields to show how email_id can be verified from database if it is already registered. It is more to show you can check email id while entering data in the form and give message to user, rather than how you create a registration form and submit it.
Let's see the code.
Step 4 - Write Ajax script for email validation (validate.js)
Now let's see the code for check_email.php
It first validates email id format using filter_var() php function. If email id format is correct, it selects same email id from candidate table. If it finds any, then it sends message as email id already exists.
Hope you understood the how Ajax is used to verify the email id. Note that we have not yet submitted the form. Let us discuss now what happens when user clicks on submit button. Please read next step.
Step 5 - Process registration form after Submit (process_registration.php)
process_registration.php is included in index.php.
It takes the input values - name, email id and gender and inserts a row with these values into the database table named 'candidate'. Below is the code:
Note that during Ajax validation, even after getting email error message, user can go ahead and submit the form, because we are not stopping user to submit the form after Ajax validation. So, in the php code here I am doing same validation again. Reason is to alert user instantly instead of waiting until user enters all data and submits the form.
Step 6 - Add CSS (style.css)
Let us add below styles. I have already added style.css in index.php.
These are simple styles. You can always add or change to make the screen look better. Keep this style.css file in your css folder. Our development is complete let us test it now.
Test the Application
Make sure in your XAMPP control panel Apache and MySQL services are running. Open the browser and run localhost/registration. You will see the home page displayed as below:
Enter Name, Email id and select Gender to submit the form. It should register successfully. Now enter same email id again to register, after entering the email id press tab or select gender. You should see a message displayed below email id field in red color.
Our development and testing are complete now. Hope you could understand all the steps and you could test it successfully.
Download Source Code
I have put all codes in a zip file. You can download it by clicking on the Download button below. You do not need to register yourself to download it. You can directly use the code or you can modify them as per your requirements.
During registration, there could be many fields to enter data for. For some fields, we can validate values from database and alert user instantly with messages. Sameway, You can check if user_id is available or not during registration using Ajax.