• Techblog369, India
  • September 29, 2022

How to create PHP QR code and Save it to Database?

Hi In this Article I am going to show how to create QR code and save it to database also fetch QR Code in a Table Create a Page addqrcode.php in …

How to Send Multiple Files Attachment Mail using Laravel

Hi in this article i am going to show how to send multiple files attachment mail in Laravel. It’s simple example of Laravel send multiple attachment in mail. I explained simply …

In this articles i am going to show how to create Change password option in using PHP AJAX and JQuery.

Hope you have already configured login register and logout option.

My User table like below

tbl_admin
id,name,email,password,created

change_password.php

<link rel="stylesheet" type="text/css" href="css/login.css"/>
<div class="container mt-4">
    <form name="frmChange" method="post" action=""
        onSubmit="return validatePassword()">
        <div style="width: 500px;">
            <div class="message"></div>
            <table border="0" cellpadding="10" cellspacing="0"
                width="500" align="center" class="tblSaveForm">
                <tr class="tableheader">
                    <td colspan="2">Change Password</td>
                </tr>
                <tr>
                    <td width="40%"><label>Current Password</label></td>
                    <td width="60%"><input type="password"
                        name="currentPassword" class="txtField" id="opwd"/><span
                        id="currentPassword" class="required"></span></td>
                </tr>
                <tr>
                    <td><label>New Password</label></td>
                    <td><input type="password" name="newPassword"
                        class="txtField" id="pwd"/><span id="newPassword"
                        class="required"></span></td>
                </tr>
                <td><label>Confirm Password</label></td>
                <td><input type="password" name="confirmPassword"
                    class="txtField" id="cpwd"/><span id="confirmPassword"
                    class="required"></span></td>
                </tr>
                <tr>
                    <td colspan="2"><input type="submit" name="submit"
                    value="Submit" class="btnSubmit"></td>
                </tr>
            </table>
        </div>
    </form>
    </div>

script.js.php

<script>
$('.btnSubmit').click(function(e){
    e.preventDefault();
    var currentPassword = $('#opwd').val();
    var newPassword = $('#pwd').val();
    var confirmPassword = $('#cpwd').val();
    
    $.ajax({
        url:"ajax/changePassword.php",
        datatype:'json',
        method:'post',
        data:{
            'currentPassword':currentPassword,
            'newPassword':newPassword,
            'confirmPassword':confirmPassword,
            'userId':<?=$_SESSION['userid'];?>
        },
        success:function(data){
            // console.log(data);
            if(data == '1'){
                swal('Successful!','Password Successfully Updated. Reloading...','success');
                setTimeout(function(){
                    location.reload();
                },1500);
            }else if(data == '2'){
                swal('Caution!','New Password Not Match','alert');
            }else if(data == '3'){
                swal('Error!','Something Went Wrong. Please Try Again Later.','error');
            }else if(data == '0'){
                swal('Caution!','Current Password Not Match','alert');
            }
        }
    });
});


</script>

Include script.js.php file in footer section and JQuery CDN

Note## .js.php extension will help to wirte js and php code in the same file

footer.php

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<?php include('script.js.php');?> 
ajax/changePassword.php

<?php
//Accessories_fetch.php
include('../Connection/Functions.php');
if(isset($_POST['currentPassword'])){
    change_password($_POST['currentPassword'],$_POST['newPassword'],$_POST['confirmPassword'],$_POST['userId']);
}


?>

Note:## You can see under the ajax folder changePassword.php file we have included Functions.php file. we will write PHP code on the same file like below

Functions.php

<?php
session_start();
include('DBClass.php');

/*Change Password function */
function change_password($currentPassword,$newPassword,$confirmPassword,$userId){
    $db = new DBClass();
    $result = $db->query('SELECT * FROM `tbl_new_admin` WHERE `id`='.$userId);
    $data = mysqli_fetch_array($result);
    $salt = $data['salt'];
    if(sha1($salt.$currentPassword) == $data['password']){
        if($newPassword == $confirmPassword){
            $tmpPassword = $salt.$newPassword;
            $updatePassword = sha1($tmpPassword);
            $query = $db->query('UPDATE `tbl_new_admin` SET `password`= "'.$updatePassword.'" WHERE `id`='.$userId);
            if($query)
                echo '1';//Successfully Updated
            else
                echo '3';//Something Went Wrong
        }else{
            echo '2';//New Password Not Match
        }
    }else{
        echo '0';//Current Password Not Match
    }
}

Note:## You can see under the functions.php file we have started session_start(); and include DBClass.php

session_start(); will help us to store data in session and no need to include separately one by one page because we have included in functions.php file and DBClass.php file is our Database connectivity settings we will us it as an object

Folder Structure

admin/Connection

  • DBClass.php
  • DBSettings.php
  • Functions.php

admin/ajax

  • All ajax file placed here.
DBClass.php

<?php
require_once( 'DBSettings.php' );
class DBClass extends DatabaseSettings{
    var $classQuery;
	var $link;
	var $errno = '';
	var $error = '';
	function __construct(){
		$settings = DatabaseSettings::getSettings();
		$host = $settings['dbhost'];
		$name = $settings['dbname'];
		$user = $settings['dbusername'];
		$pass = $settings['dbpassword'];
		$this->link = new mysqli( $host , $user , $pass , $name );
	}
	function query( $query ) {
		$this->classQuery = $query;
		return $this->link->query( $query );
	}
	function lastInsertedID(){
		if($this->link->insert_id)
		    return $this->link->insert_id;
		else
		    $this->link->errno;
	}
}
?>

DBSettings.php

<?php
class DatabaseSettings{	
	var $settings;
	function getSettings()
	{
		// Database variables
		// Host name
		$settings['dbhost'] = 'localhost';
		// Database name
		$settings['dbname'] = 'yourdbname';
		// Username
		$settings['dbusername'] = 'dbusername';
		// Password
		$settings['dbpassword'] = 'dbpassword';
		return $settings;
	}
}
?>
Custom CSS for password reset page

body {
    font-family:Arial;
    }
    input {
    font-family:Arial;
    font-size:14px;
    }
    label{
    font-family:Arial;
    font-size:14px;
    color:#999999;
    }
    .tblSaveForm {
    border-top:2px #999999 solid;
    background-color: #f8f8f8;
    }
    .tableheader {
    background-color: #fedc4d;
    }
    .btnSubmit {
    background-color:#fd9512;
    padding:5px;
    border-color:#FF6600;
    border-radius:4px;
    color:white;
    }
    .message {
    color: #FF0000;
    text-align: center;
    width: 100%;
    }
    .txtField {
    padding: 5px;
    border:#fedc4d 1px solid;
    border-radius:4px;
    }
    .required {
    color: #FF0000;
    font-size:11px;
    font-weight:italic;
    padding-left:10px;
    }

Thanks for reading……

Author

admin@techblog369.in

Leave a Reply

Your email address will not be published.