Today, We want to share with you multiple image upload in php code with databases demo.In this post we will show you image upload in php mysql, hear for upload image in php mysql database and display we will give you demo and example for implement.In this post, we will learn about PHP Multiple Images Upload Using JQuery Ajax with an example.
How to Upload Multiple Images and Store in Database using PHP, MySQL
Contents
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>Upload Multiple Images with PHP - www.pakainfo.com</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.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link rel="icon" href="https://codingbirdsonline.com/wp-content/uploads/2019/12/cropped-coding-birds-favicon-2-1-192x192.png" type="image/x-icon">
</head>
<body>
<div class="jumbotron text-center">
<h1>Upload Multiple Images with PHP</h1>
<p>Resize this responsive page to see the effect!</p>
</div>
<div class="container">
<form action="upload-script.php" method="post" enctype="multipart/form-data">
<div class="form-group">
<div class="row">
<div class="col-md-4">
<div class="form-group">
<input type="file" name="profileDpImg[]" required multiple class="form-control">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<input type="submit" name="fileOrPictureSave" id="fileOrPictureSave" value="Upload Images" class="btn btn-success">
</div>
</div>
</div>
</div>
</form>
<div class="row">
<?php
// fetch Images
$i = 1;
include "config.php";
$sqlQQ = "SELECT * FROM products_list";
$response = $connection->query($sqlQQ);
if ($response->num_rows > 0 ){
while ($row = $response->fetch_object()){ ?>
<div class="col-sm-3">
<h3>Image <?php echo $i;?></h3>
<img src="<?php echo 'uploads/'.$row->profilenm;?>"/>
</div>
<?php $i++;
}
}
?>
</div>
</div>
</body>
</html>
Display Images from Database
<?php
// fetch Images
$i = 1;
include "config.php";
$sqlQQ = "SELECT * FROM products_list";
$response = $connection->query($sqlQQ);
if ($response->num_rows > 0 ){
while ($row = $response->fetch_object()){ ?>
<div class="col-sm-3">
<h3>Image <?php echo $i;?></h3>
<img src="<?php echo 'uploads/'.$row->profilenm;?>"/>
</div>
<?php $i++;
}
}
?>
upload-script.php
<?php
include "config.php";
if (isset($_POST['fileOrPictureSave'])) {
$uploadFolder = 'uploads/';
foreach ($_FILES['profileDpImg']['tmp_name'] as $key => $image) {
$imageTmpName = $_FILES['profileDpImg']['tmp_name'][$key];
$imageName = $_FILES['profileDpImg']['name'][$key];
$result = move_uploaded_file($imageTmpName,$uploadFolder.$imageName);
// save to database
$query = "INSERT INTO products_list SET profilenm='$imageName' " ;
$run = $connection->query($query) or die("Error in saving image".$connection->error);
}
if ($result) {
echo '<script>alert("Images uploaded successfully !")</script>';
echo '<script>window.location.href="index.php";</script>';
}
}
The database connection file
<?php $hostName = "localhost"; $username = "root"; $password = "[email protected]"; $databaseName = "Pakainfo_demo"; $connection = new mysqli($hostName,$username,$password,$databaseName); if (!$connection) { die("Error in database connection". $connection->connect_error); } ?>
Create an image/file uploading form
<form action="upload-script.php" method="post" enctype="multipart/form-data">
<div class="form-group">
<div class="row">
<div class="col-md-4">
<div class="form-group">
<input type="file" name="profileDpImg[]" required multiple class="form-control">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<input type="submit" name="fileOrPictureSave" id="fileOrPictureSave" value="Upload Images" class="btn btn-success">
</div>
</div>
</div>
</div>
</form>
I hope you get an idea about image upload in php code with databases.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, donโt forget to share.
I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I’m a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.