Image upload using php and MySQL database

Image upload using php and MySQL database

We construct a type in this tutorial that takes up an image and some text. The data will be sent to the server when the user selects an image and enters some text, and clicks the submit button. PHP now captures the image and saves it to a project folder, and then saves the text to the database along with a connection pointing to the picture in the folder.

Create a database called image upload, and create a table with fields called images:

  • id - int(11)
  • image - varchar(100)
  • image_text - text

or use this code to create table

CREATE TABLE `image_upload` (
  `id` int(11) NOT NULL,
  `image` varchar(100) NOT NULL,
  `image_text` varchar(1000) NOT NULL

Create a file called index.php and page the following code in it (the complete code):

  // Create database connection
  $db = mysqli_connect("localhost", "root", "", "image_upload");

  // Initialize message variable
  $msg = "";

  // If upload button is clicked ...
  if (isset($_POST['upload'])) {
  	// Get image name
  	$image = $_FILES['image']['name'];
  	// Get text
  	$image_text = mysqli_real_escape_string($db, $_POST['image_text']);

  	// image file directory
  	$target = "images/".basename($image);

  	$sql = "INSERT INTO images (image, image_text) VALUES ('$image', '$image_text')";
  	// execute query
  	mysqli_query($db, $sql);

  	if (move_uploaded_file($_FILES['image']['tmp_name'], $target)) {
  		$msg = "Image uploaded successfully";
  		$msg = "Failed to upload image";
  $result = mysqli_query($db, "SELECT * FROM images");
<!DOCTYPE html>
<title>Image Upload</title>
<style type="text/css">
   	width: 50%;
   	margin: 20px auto;
   	border: 1px solid #cbcbcb;
   	width: 50%;
   	margin: 20px auto;
   form div{
   	margin-top: 5px;
   	width: 80%;
   	padding: 5px;
   	margin: 15px auto;
   	border: 1px solid #cbcbcb;
   	content: "";
   	display: block;
   	clear: both;
   	float: left;
   	margin: 5px;
   	width: 300px;
   	height: 140px;
<div id="content">
    while ($row = mysqli_fetch_array($result)) {
      echo "<div id='img_div'>";
      	echo "<img src='images/".$row['image']."' >";
      	echo "<p>".$row['image_text']."</p>";
      echo "</div>";
  <form method="POST" action="index.php" enctype="multipart/form-data">
  	<input type="hidden" name="size" value="1000000">
  	  <input type="file" name="image">
      	placeholder="Say something about this image..."></textarea>
  		<button type="submit" name="upload">POST</button>

And that's all.

Make sure to include the enctype in your tag of shape. Like this:

<form method="POST" action="index.php" enctype="multipart/form-data">

The image will not be uploaded without the attribute enctype="multipart/form-data". Enctype is the encoding style that determines how to encode the document-data when sending the form. Uploads of files without it won't work.

Leave comment

Comments (1)


What are you searching for....?


Subscribe to us on youtube for updates of our videos first on youtube.


To receive updates on the latest news, tutorials and special offers, subscribe to our email newsletter today!


We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Privacy Policy That's Fine