I am building a page that allows me to upload and delete the picture. Also, I can view the picture on that page. For now, I am able to upload the picture and the picture will be stored in my C: drive folder and the records will be uploaded to MySql. However, I am not able to delete the picture and view the picture on the page. I am not sure the reasons for these. I guess the problem maybe the naming and the file location for the pictures.
When I upload the picture, the naming in the C: drive will be changed it to according to the time as the name. The naming for the records in MySql will still remain the same. 
I am not sure how to convert these two images to the same name and provide a path in MySql that allow me to show the image so as to delete my pictures.
The code for my page is below:
<div class="container">
<?php
include "config.php";
if (isset($_FILES['file'])) {
//////
if ($_FILES["file"]["error"] > 0) {
echo "Error: :{$_FILES["file"]["error"]}<br>";
} else {
$allowdExts = ["jpg", "jpeg", "gif", "png"];
$filenameStrArr = explode(".", $_FILES["file"]["name"]);
$extension = strtolower(end($filenameStrArr));
////-----------------------------
$name = $_FILES['file']['name'];
$size = $_FILES['file']['size'];
$type = $_FILES['file']['type'];
$tmp = $_FILES['file']['tmp_name'];
///-------------------------------
$allowedTypes = ["image/jpg", "image/jpeg", "image/gif", "image/png", "image/pjpeg"];
$fileType = $_FILES["file"]["type"];
$sizeLimit = 2000;
$fileSize = $_FILES["file"]["size"] / 1024; //divide to get size in kb
if (in_array($extension, $allowdExts) &&
in_array($fileType, $allowedTypes) &&
($fileSize <= $sizeLimit)) {
$distDir = "../uploads/";
$distFilename = "pic_" . time() . ".{$extension}";
$upload = $distDir . "/" . $distFilename;
//$distFinal = "upload/" . $_FILES["myFile"]["name"];
move_uploaded_file($_FILES['file']['tmp_name'], $upload);
}
}
/*
$file = '../uploads/' . $_FILES['file']['name'];
$upload = move_uploaded_file($tmp, $file); */
if ($upload) {
$add = $db->prepare("insert into upload values('',?)");
$add->bindParam(1, $name);
if ($add->execute()) {
?>
<div class="alert alert-success alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Success!</strong> File upload successful to database.
</div>
<?php
} else {
?>
<div class="alert alert-danger alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Failed!</strong> File upload unsuccessful to database.
</div>
<?php
}
} else {
?>
<div class="alert alert-warning alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Sorry!</strong> File upload unsuccessful .
</div>
<?php
}
}
?>
<form method="post" enctype="multipart/form-data">
<div class="form-group">
<label for="file">Upload File</label>
<input type="file" id="file" name="file">
<p class="help-block">This will be the picture you upload.</p>
</div>
<button type="submit" class="btn btn-default">Upload</button>
</form>
<p><br/></p>
<div class="row">
<?php
if (isset($_GET['remove'])) {
$img = $_GET['remove'];
$id = $_GET['id'];
$remove = unlink('uploads'.$img);
if ($remove) {
$rmv = $db->prepare("delete from upload where id='$id'");
if ($rmv->execute()) {
?>
<div class="alert alert-success alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Success!</strong> File removed from directory and database .
</div>
<?php
} else {
?>
<div class="alert alert-danger alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Failed!</strong> File failed erased from database.
</div>
<?php
}
} else {
?>
<div class="alert alert-warning alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Error!</strong> File is not erased from directory.
</div>
<?php
}
}
$stmt = $db->prepare("select * from upload");
$stmt ->execute();
while ($row = $stmt->fetch()) {
?>
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img style="height:200px;"src="uploads<?php echo$row['foto'] ?>" alt="<?php echo$row['foto'] ?>" title="<?php echo$row['foto'] ?>">
<div class="caption text-center">
<p><a href="?remove=<?php echo$row['foto'] ?> &id<?php echo$row['id'] ?>" class="btn btn-danger" role="button">Delete</a></p>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
