1 Star2 Stars3 Stars4 Stars5 Stars (24 votes, average: 5.00 out of 5)

Lost Password Script AJAX jQuery Bootstrap PHP and MySql

Download all scripts here for this tutorial.

Create a file and call it index.php. Insert the following code into it and save it. This will be the main file where the process starts.

Tip: Click on images to make them larger. If you find anything wrong on this page or need further assistance please comment below or contact me. 🙂
<!DOCTYPE html>
<html lang="en">
<title>Lost Password Script AJAX jQuery Bootstrap PHP and MySql</title>
 <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="container">
 <div class="form-group">
 <label for="email">Email:</label>
 <input id="email" class="form-control" type="email" placeholder="Your Email">
<button type="submit" id="submit" class="btn btn-default">Reset Password</button>
<div id="display"></div>
var em = $("#email").val();
var dataString = 'em1='+ em;
type: "POST",
url: "processor.php",
data: dataString,
cache: false,
success: function(result){
return false;

Now create a file and call it processor.php and enter the following code into it.

$email=mysqli_real_escape_string($con, $_POST['em1']);
$emailclean = filter_var($email, FILTER_SANITIZE_EMAIL, FILTER_FLAG_STRIP_HIGH);
//query the database
$result = $con->query("SELECT * FROM users WHERE email='$emailclean' LIMIT 1") ;
echo '<div class="alert alert-warning">Are you sure you entered the correct email?</div>';
while ($row = $result->fetch_assoc()) {
//email the form to the person who lost their password
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= 'From: <[email protected]>' . "\r\n";
$message='<table width="100%" border="1">
<tr><td colspan="2" align="center">RESET YOUR PASSWORD BY CLICKING LINK BELOW</td></tr>
<tr><td colspan="2" align="center">If you did not make this request then ignore this email.</td></tr><tr><td colspan="2" align="center"><a href="http://localhost/ajax/lostpassword.php?p='.$password.'">Reset Password</a></td></tr>
<tr><td colspan="2" align="center"><img src="https://a1websitepro.com/wp-content/uploads/2014/09/logo200.png" width="200px"/></td></tr>

//send message back to AJAX
echo '<div class="alert alert-success">An email has been sent to '.$email.' with a password reset link.</div>';
Lost Password Script AJAX jQuery Bootstrap PHP and MySql was last modified: June 11th, 2017 by Maximus Mccullough

Subscribe To My YouTube Channel:

Please like, share and subscribe.

Advanced Programming Made Easy

I hope you enjoyed the article. If I was able to help you please consider a tip for the content.

One Time Tip

more tips

Reoccuring Tips


Cool People Share:
Lost Password Script AJAX jQuery Bootstrap PHP and MySql

Pages:Previous 1 2 3 4 Next

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.