tutorialswb

TutorialsWB hadir sebagai wadah bagi teman-teman yang ingin "Belajar PHP Dasar". Sehingga kami yakin bahwa TutorialsWB akan menjadi Pusat "Belajar Bahasa Pemrograman PHP" Disamping PHP website ini menyediakan berbagai tips dan trik Blogger. Kami menerima Pemasangan iklan banner atau artikel.

Hubungi Saya

Reset Password Dengan Konfirmasi Menggunakan PHP MySQLi



Kalian pasti reset password baik itu reset pasword email dan password yang terdapat aplikasi mobile anda bahkan beberapa aplikasi yang anda gunakan.

Ketika anda masih ingat ketika anda melakukan reset password pasti anda diminta memasukkan password baru kemudian anda diwajibkan memasukkan password lama sebagai konfirmasi. lihat gambar dibawah ini sebagai bayangan.

reset password dengan konfirmasi


Nah kali ini kmai akan mencoba reset password yang sama yaitu menggunakan konfirmasi dengan memasukkan password baru kemudian sistem akan meminta anda memasukkan password lama anda sebagai konfirmasi, ketika anda memasukkan password lama dengan tidak tepat reset password yang anda lakukan akan ditolak oleh sistem.

Langsung saja mari kita mulai dari awal. Let's it...

1. Database

Buat database dengan nama password kemduian masukkan struktur database dibawah ini.
 CREATE TABLE `user` (
  `user_id` int(11) NOT NULL,
  `username` varchar(20) NOT NULL,
  `password` varchar(12) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1; 

2. Koneksi Database

Buat file dengan nama conn.php file ini berfungsi untuk koneksi kedatabase
 <?php
$conn = new mysqli('localhost', 'root', '', 'password') or die(mysqli_error());

if(!$conn){
 die("Error: Failed to connect to database");
}
?> 

3. Save User

Buat file dengan nama save_user.php file ini berisi script untuk memasukkan data user kedatabase.
 <?php
 require_once 'conn.php';
 if(ISSET($_POST['save'])){
  $username = $_POST['username'];
  $password = $_POST['password'];

  
  $conn->query("INSERT INTO `user` VALUES('', '$username', '$password')") or die($conn->error());
  
  header('location: index.php');
 }
?> 

4. Update Password

Buat file dengan nama update_password.php file ini berisi script yang berfungsi untuk update password.
 <?php
require_once 'conn.php';

if(ISSET($_POST['update'])){
 $user_id = $_POST['user_id'];
 $username = $_POST['username'];
 $newpassword = $_POST['newpassword'];
 $confirmpassword = $_POST['confirmpassword'];
 $oldpassword = $_POST['oldpassword'];


 if($newpassword == $confirmpassword){
  $query = $conn->query("SELECT * FROM `user` WHERE `user_id` = '$user_id' && `password` = '$oldpassword'") or die($conn->error());
  $valid = $query->num_rows;

  if($valid > 0){
   $conn->query("UPDATE `user` SET `username` = '$username', `password` = '$newpassword' WHERE `user_id` = '$user_id'") or die($conn->error());
   echo "<script>alert('Password updated')</script>";
   echo "<script>window.location = 'index.php'</script>";
  }else{
   echo "<script>alert('Password does not match to old password')</script>";
   echo "<script>window.location = 'index.php'</script>";
  }

 }else{
  echo "<script>alert('Password does not match')</script>";
  echo "<script>window.location = 'index.php'</script>";
 }
 
}
?> 

5. Form

Buat file dengan nama index.php file ini berisi script yang berfungsi sebagai script form utama dan form modal yang memanggil masing-masing fungsi dari save_user php dan update_password.php
 <!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"/>
 <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
</head>
<body>
 <nav class="navbar navbar-default">
  <div class="container-fluid">
   <a class="navbar-brand" href="https://www.tutorialswb.com/">TutorialsWB</a>
  </div>
 </nav>
 <div class="col-md-3"></div>
 <div class="col-md-6 well">
  <h3 class="text-primary"><center>Reset Password Dengan Konfirmasi</center></h3>
  <hr style="border-top:1px dotted #ccc;"/>
  <button type="button" class="btn btn-success" data-toggle="modal" data-target="#form_modal"><span class="glyphicon glyphicon-plus"></span> Add user</button>
  <br /><br />
  <table class="table table-bordered">
   <thead class="alert-info">
    <tr>
     <th>Username</th>
     <th>Password</th>
     <th>Action</th>
    </tr>
   </thead>
   <tbody style="background-color:#2794da;">
    <?php
    require 'conn.php';
    $query = $conn->query("SELECT * FROM `user`") or die($conn->error());
    while($fetch = $query->fetch_array()){
     ?>
     <tr>
      <td><?php echo $fetch['username']?></td>
      <td><?php echo str_replace($fetch['password'], "SECRET", $fetch['password'])?></td>
      <td><button type="button" class="btn btn-warning" data-toggle="modal" data-target="#update_modal<?php echo $fetch['user_id']?>">Change Password</button></td>
     </tr>
     
     <div class="modal fade" id="update_modal<?php echo $fetch['user_id']?>" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog" role="document">
       <form action="update_password.php" method="POST" enctype="multipart/form-data">
        <div class="modal-content">
         <div class="modal-body">
          <div class="col-md-2"></div>
          <div class="col-md-8">
           <div class="form-group">
            <label>Username</label>
            <input type="hidden" name="user_id" value="<?php echo $fetch['user_id']?>"/>
            <input class="form-control" type="text" name="username" value="<?php echo $fetch['username']?>" required="required" />
           </div>
           <div class="form-group">
            <label>New Password</label>
            <input class="form-control" type="password" maxlength="12" name="newpassword" required="required"/>
           </div>
           <div class="form-group">
            <label>Confirm Password</label>
            <input class="form-control" type="password" maxlength="12" name="confirmpassword" required="required"/>
           </div>
           <div class="form-group">
            <label>Old Password</label>
            <input class="form-control" type="password" maxlength="12" name="oldpassword" required="required"/>
           </div>
          </div>
         </div>
         <div style="clear:both;"></div>
         <div class="modal-footer">
          <button type="button" class="btn btn-danger" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Close</button>
          <button name="update" class="btn btn-primary"><span class="glyphicon glyphicon-save"></span> Update</button>
         </div>
        </div>
       </form>
      </div>
     </div>
     
     
     
     <?php
    }
    ?>
   </tbody>
  </table>
 </div>
 <div class="modal fade" id="form_modal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog" role="document">
   <form action="save_user.php" method="POST" enctype="multipart/form-data">
    <div class="modal-content">
     <div class="modal-body">
      <div class="col-md-2"></div>
      <div class="col-md-8">
       <div class="form-group">
        <label>Username</label>
        <input class="form-control" type="text" name="username" required="required" />
       </div>
       <div class="form-group">
        <label>Password</label>
        <input class="form-control" type="password" maxlength="12" name="password" required="required"/>
       </div>
      </div>
     </div>
     <div style="clear:both;"></div>
     <div class="modal-footer">
      <button type="button" class="btn btn-danger" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Close</button>
      <button name="save" class="btn btn-primary"><span class="glyphicon glyphicon-save"></span> Save</button>
     </div>
    </div>
   </form>
  </div>
 </div>
</body>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.js"></script>
</html> 

Kalian bisa mendownload file dan melihat demonya dibawah ini.


Sekain share kali ini semoga apa yang kami share bermanfaat bagi anda semua, silahkan tinggalkan komentar dan mulai berdiskusi dengan kami.



Baca Juga

closed