I found some code and it simply results in a white screen. I’ve looked over the code and can’t find anything obvious. Maybe someone here can find the problem? The first page (photo_gallery.php) loads and appears to work fine, the result page (imageUpload.php) is just a blank white page. There’s only 3 files, the third is to delete an image. It’s a very simple script that I want to use as a basis to work from.
Here is the code:
photo_gallery.php
<?php
require('connection.php');
session_start();
?>
<!DOCTYPE html>
<html>
<head>
<title>Image Gallery</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" media="screen">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.js"></script>
<style type="text/css">
.gallery
{
display: inline-block;
margin-top: 20px;
}
.close-icon{
border-radius: 50%;
position: absolute;
right: 5px;
top: -10px;
padding: 5px 8px;
}
.form-image-upload{
background: #e8e8e8 none repeat scroll 0 0;
padding: 15px;
}
</style>
</head>
<body>
<div class="container">
<h3>Image Gallery</h3>
<form action="imageUpload.php" class="form-image-upload" method="POST" enctype="multipart/form-data">
<?php if(!empty($_SESSION['error'])){ ?>
<div class="alert alert-danger">
<strong>Whoops!</strong> There were some problems with your input.<br><br>
<ul>
<li><?php echo $_SESSION['error']; ?></li>
</ul>
</div>
<?php unset($_SESSION['error']); } ?>
<?php if(!empty($_SESSION['success'])){ ?>
<div class="alert alert-success alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong><?php echo $_SESSION['success']; ?></strong>
</div>
<?php unset($_SESSION['success']); } ?>
<div class="row">
<div class="col-md-5">
<strong>Title:</strong>
<input type="text" name="title" class="form-control" placeholder="Title">
</div>
<div class="col-md-5">
<strong>Image:</strong>
<input type="file" name="image" class="form-control">
</div>
<div class="col-md-2">
<br/>
<button type="submit" class="btn btn-success">Upload</button>
</div>
</div>
</form>
<div class="row">
<div class='list-group gallery'>
<?php
$sql = "SELECT * FROM image_gallery";
$images = $mysqli->query($sql);
while($image = $images->fetch_assoc()){
?>
<div class='col-sm-4 col-xs-6 col-md-3 col-lg-3'>
<a class="thumbnail fancybox" rel="ligthbox" href="images/<?php echo $image['image'] ?>">
<img class="img-responsive" alt="" src="images/<?php echo $image['image'] ?>" />
<div class='text-center'>
<small class='text-muted'><?php echo $image['title'] ?></small>
</div> <!-- text-center / end -->
</a>
<form action="imageDelete.php" method="POST">
<input type="hidden" name="id" value="<?php echo $image['id'] ?>">
<button type="submit" class="close-icon btn btn-danger"><i class="glyphicon glyphicon-remove"></i></button>
</form>
</div> <!-- col-6 / end -->
<?php } ?>
</div> <!-- list-group / end -->
</div> <!-- row / end -->
</div> <!-- container / end -->
</body>
<script type="text/javascript">
$(document).ready(function(){
$(".fancybox").fancybox({
openEffect: "none",
closeEffect: "none"
});
});
</script>
</html>
imageUpload.php
<?php
session_start();
require('connection.php');
if(isset($_POST) && !empty($_FILES['image']['name']) && !empty($_POST['title']))
{
$name = $_FILES['image']['name'];
list($txt, $ext) = explode(".", $name);
$image_name = time().".".$ext;
$tmp = $_FILES['image']['tmp_name'];
if(move_uploaded_file($tmp, 'images/'.$image_name))
{
$sql = "INSERT INTO image_gallery (title, image) VALUES ('".$_POST['title']."', '".$image_name."')";
$mysqli->query($sql);
$_SESSION['success'] = 'Image Uploaded successfully.';
header("Location: photo_gallery.php");
}
else
{
$_SESSION['error'] = 'image uploading failed';
header("Location: photo_gallery.php");
}
}
else
{
$_SESSION['error'] = 'Please Select Image or Write title';
header("Location: photo_gallery.php");
}
?>
imageDelete.php
<?php
session_start();
require('connection.php');
if(isset($_POST) && !empty($_POST['id']))
{
$sql = "DELETE FROM image_gallery WHERE id = ".$_POST['id'];
$mysqli->query($sql);
$_SESSION['success'] = 'Image Deleted successfully.';
header("Location: photo_gallery.php");
}
else
{
$_SESSION['error'] = 'Please Select Image or Write title';
header("Location: photo_gallery.php");
}
?>