Monday, February 26, 2018

How To Create Login With PHP, Jquery And AJAX

Leave a Comment



Hi Everyone, In this tutorial we will learn how to create PHP login page with Jquery and AJAX. Before start this tutorial, better have previouse knowloedge in Jquery And AJAX.The code will give you an idea to easily create a member area on your websites and provide easy login process.

Step 1  - Create Database And Table



Once you create your database table, add some data and do not forget to make the connection with database.

Step 2 - Create HTML Form

create the html form save it as index.php. if you wish you can divide the page into header and footer page, that will make your page more convenience. 

Make sure here we are not going to use the form method and actione in order to send the credential to server, instead we goin to use AJAX to send the credential to server, for that leav as blank action attribute and method attribute.

Step 3 - Create Login Page 

Create Login.php and add bellow codes. 



The page get all the $_POST value from AJAX method and check in the mysql table using given username and password, if the given credential are correct it will redirect to success page, if credential are wrong it will redirect to index page. In order to prevent from unauthorize access i have been use session too.

Step 4 - Create Login Js File 

The page has used AJAX $.post method to send credential to server. along with, in order to validate the input data i have several Jquery methods you to use. 

Step 5 - Logout Page

We have created php login functionality using AJAX, now will create logout file that will show on the successful login of the user.The logout page will handle logout functionality using PHP Session.
We have stored username at the time sign-in into session and destroy the PHP session using logout functionality.



i hope this tutorial will give you a basic idea of creating PHP login AJAX and Jquery. If you have any doubt feel free contact via - webriderat@gamil.com Happy coding

https://docs.google.com/uc?export=download&id=1SIdRpqZKjbYXj2VN37YPIvD4a6mZT1yK 
If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment