How to develop change password in PHP and MySQL with login and logout

When an user logs into a web application, there should always be an option for the user to change the login password. In this topic I will show how to write PHP code to change password using MySQL database. Change password works for the current logged in user who wants to change his/her password. So, I will show the code for login and logout also in this application.

The application will have a simple top menu where Login link will be displayed. After user logs into the application, he/she can see links for change password and logout. Also, user name will be displayed in the top menu after login.

Change password in PHP and mysql

You can also read below topics:

  1. How to create a login and registration form with menu in PHP and MySQL
  2. How to display user name on header after login using PHP session

change password code example - PHPAssumption

  1. You must have basic knowledge in PHP, HTML, CSS and JavaScript. You can read below topics for more details:
    1. How to install xampp for Windows with setup for PHP development
    2. How to write PHP code with examples for beginners
    3. How to build a simple CRUD application in PHP and MySQL

Change Login to logout after usersFolders and Files

Below is a screenshot of the folder structure and files I am using:

change password code in php mysql using md5

I have created a folder called 'change_pwd' under 'htdocs' as I am using XAMPP. If you are using WAMP, create 'change_pwd' folder under 'www'. Not necessarily you have to create 'change_pwd' folder, you can use any folder you want.

  1. Folder 'cfg' - In this folder I have kept dbconnect.php which is used to connect to the MySQL database.
  2. Folder 'css' - My custom stylesheet is in this folder
  3. Folder 'js' - In this folder I have my custom JavaScripts

A menu bar(top_menu.php) will be displayed on the top and there will be two links for Home (index.php) and Login (login.php). Below is the screenshot of the page after user logs in:

change login password in PHP and MYSQL

When user clicks on Change Password from menubar, below screen is displayed:

change login button to logout after the user login PHP

Step 1 - Create a MySQL table to store user details

Let us create a table named 'users' in MySQL database. This table will have user details. During login, userid (here email id will be used as userid) and password will be verified against the values in this table. I have a database called 'demo'. So 'users' table will be created in this 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:

Create Login Form Using PHP

Table has 5 columns.

  1. id - it is the primary key and auto incremented
  2. email - email id of the user
  3. name - name of the user
  4. password - password for the user
  5. signup_date - date of signup, default is current date, this is not required for login, used as information purpose only
Create table script for this table is given below, you can use this code to create the table. You can also download (see download section later in this topic) and get the scripts.

users.sql

Please verify if data is inserted correctly, it should have below data in it, signup_date should be current date.

Creating a User Login System with PHP and MySQL

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.

dbconnect.php

I am using mysqli_connect() function which needs 4 parameters.

  1. server - in our case it is localhost
  2. userid - we are using root user
  3. password - no password for user root
  4. database name - demo in our case.
If connection is successful then it will return true and false otherwise. This Boolean value is returned and stored in the $conn variable. We will include this dbconnect.php in other php programs so that we do not need to write it again in the program. For detail database connection understanding please read topic How to Connect to MySQL database in PHP using mysqli_connect.

Step 3 - Create a top menu (top_menu.php)

This is the top menu which will display the Menu items Home, Login, Change Password and Logout on a menu bar. I will include this menu in all the Home, Login and Change Password pages so that this menu will be visible in those pages.

top_menu.php

PHP session is used here for login and logout. You can see I have added links corresponding to Home, Login, Change Password and Logout. Once user logs in we will set session variables and display Login or Logout.

Step 4 - Create a PHP Login form (login.php)

Login form has email id and password for the user to login to the system. For login we have to validate email id and password entered by the user against the values stored in the database.

Change User Password by Validating Current Password in PHP

Let us look at the code for login.php

login.php

In the first two lines I have added top menu and our database connection php programs. A login form is defined. Once form is submitted, it checks email and password from database. After successful login, email id and user name are added in two session variables and user is redirected to home page.

Step 5 - Develop Change Password (change_pwd.php)

set login and logout in php

When user clicks on Change Password, the form is displayed, user can enter new password and submit. We will do some validation to check that passwords (password and confirm password) entered by the user are same. Also, I will check that new password is not same as current password.

Let's see the code of my change password program.

change_pwd.php

I am checking if user is logged in or not. Because user cannot change his/her password without login. If email session variable is set then user is logged in, else give message and redirect to home.page.

We are using a JavaScript function called validate() on the onsubmit event of the form. This is to check if passwords entered by the user are same. This function is defined under JavaScript file validate.js.

Once form is submitted, new password is checked with the current password. If it is different, new password is updated in database table.

I have created a simple home page (index.php) just to display success message. I have not developed a detail home page here. You can create your own home page.

index.php

Lastly, I want to show logout.php as below:

logout.php

Here, we are unsetting all session variables by using session_unset() function. Then deleting session using session_destroy() function. After session is deleted, user is logged out and redirected to the home page.

Step 6 - Add CSS (style.css)

Let us add below styles. I have already added style.css in top_menu.php.

style.php

You can see simple styles are added here. Keep this style.css file in your css folder.

Step 7 - Add JavaScript/jQuery (validate.js)

You have already seen togglePwd() function is called from login form when checkbox - "Show Password" is clicked. Also, validate() function was called during change password form submission. Keep validation.js file in js folder.

validate.js

In togglePwd() function, type of input object - password is changed from "text" to "password" and vice versa.

In validate() function, it checks if password and confirm password are same or not. If they are not same it returns false so that the form is not submitted.

With this, our development is complete now, let us test the application now.

change php passwordTest the Application

Make sure in your XAMPP control panel services are running. Open the browser and run localhost/change_pwd. You will see the home page displayed. See the below screen:

Login in PHP

Click on Login from the menu. Enter email id as 'test@test.com', password as '123'. Click on Login button. You should be able to login successfully and see the home page again. But this time, you should see user name is displayed along with Change Password and Logout options. Click on Change Password and give a new password and submit. You will see successful message displayed as below:

Change password in PHP

Close the message. To check the new password, logout and login again with new password. If you can login with new password successfully, then password was updated correctly. Again, go for password change and test by giving two different passwords to see if you get the alert. Also test by giving the current password as new password and see if error message is displayed.

You can play around with it and test various cases. Hope you could understand all the steps in this topic.

write logout code in phpImportant Note

  1. I have not used any password policy during change password, that is, requirements as mixture of digits, upper-case, lower-case letters or special characters etc. are not given. Since this is more for learning, I have not enforced any password rules here.
  2. In the Change Password form, I am not asking for current password as user is already logged in. However, for better security, you can have another field to enter current password. If current password matches, then only allow change password.

Scope of Improvement:

  1. Put some contents in Home Page to make the page look better.
  2. Give some minimum password requirement at least enforce a minimum length of password, may be 6 charcaters.
  3. Send an email to the user as soon as password is changed successfully. You can read the topic How to send mail using mail() function in PHP with example and integrate it with change password.

download source code for Change password in PHPDownload 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.

login form in php and mysql source codeConclusion

Change Password is a basic requirement for any application. In real project there can be various other areas related to password policy, like user can not repeat any of the last 3 passwords or sending an email to the user as soon as password is changed. Here, I made it very simple for you, you can always improve it. Hope it will be useful for you.