How To Upload Image In PHP And Store In Database

Uploading images or files in PHP and Mysqli database is an important part of any web application. In this tutorial, we will learn the step by step process to upload images in PHP and store in a database.

If you have images, Ms Word file, Excel file or any type of file format you can follow this tutorial.

Download Source Code (Upload Images)

Step 1: Creating an HTML Form for Uploading Images

The first step is to create a file with “index.php” and then write a simple HTML form code with only two elements an input file and button element.

<!DOCTYPE html>
<html>
<head>
	<title>File Upload to Database</title>
</head>
<body>

			
<div>

<h1>File Upload with PHP and MySQLI</h1>


<form action="" method="post" enctype="multipart/form-data">
							
							Upload Images/File : <input type="file" name="uploadfile">

						   </br>
						   
						    <button type="submit" name="submitform">Upload</button>
						</form>

			</div>



			

</body>
</html>

Now it’s time to explain the above code line by line first write the code of the basic HTML file structure. Within body write code for HTML Form by opening and closing the form tags and for file elements and then button.

The important step to note here is giving file and button element a proper name and give the attribute name value in the form tag enctype=”multipart/form-data ” attribute is important for uploading a file.

Step 3: Create a Database and Table in PhpMyAdmin

We have created a database with the name of “test” and table with the name of “images”. The table will contain only two fields. One will be a primary and auto increment “Id” and second will be with the name of “file” which will store the upload file name. Check the below images to understand the structure of the table and fields.

mysqli-database-table-for-uploadin-image-in-php

 

Step 3: Creating a MySQLI Database Connection in PHP

Write the below code to connect database in PHP. We are using the MySQLI extended version of mysql. Create a new file with “connection.php” name write the copy and past the code.

&lt;?php $con=mysqli_connect("localhost","root", "","test"); ?&gt;

Check Also:  Learn WordPress Theme Development Tutorials

Now next step is to include the “connection.php” file in your “index.php” file. We can do this by two PHP functions through “require” and “include”. I will use the “require” as they do the same work but its more secure and handy to use. Copy and paste the following code in the first line of “index.php” file.

require file in php

 

Step 4: Upload and store images in database with PHP and MySQLI

Create a folder in the with the name upload where all the uploaded images/files will be the store.

In the database we will just store a name of the file and if a file with the same name already exist we will rename the name by adding the current time.

		if(isset($_POST['submitform']))
		{
			$dir="upload/";
			$image=$_FILES['uploadfile']['name'];
			$temp_name=$_FILES['uploadfile']['tmp_name'];

			if($image!="")
			{
				if(file_exists($dir.$image))
				{
					$image= time().'_'.$image;
				}

				$fdir= $dir.$image;
				move_uploaded_file($temp_name, $fdir);
			}

				$query="insert IGNORE into `images` (`id`,`file`) values ('','$image')";
				mysqli_query($con,$query) or die(mysqli_error($con));
				
				echo "File Uploaded Suucessfully ";

		}

Now its time to write the PHP code for uploading the image and store in a database. First, we will write an if condition and check weather the file is uploaded and the button is clicked then execute the code.

$_File is a global PHP variable and contain all the information of uploaded file. $dir is a variable where the path of “upload” folder is  the store. “$temp_name” is used to store the temporary file name of the uploaded image.

“move_upload_file” is a PHP function which takes two arguments first one to pass the variable of temporary location and a second one is the permanent destination. Move_uploaded_file is used to upload a file to a server.

Now write the MySQLI insert query to store the images to the database table. We will store just the uploaded images name and id will be auto increment.

How to Retrieve or show images from Database table

In this section, we will learn how to retrieve or show images from the database table. We will use the “SQL SELECT” query to fetch record from the table.

Learn PHP programming

To show only one record, we simply write the query and execute it while if we want to show all the record form the table, we will use the “while loop” in which the condition will be true until the record is not finished and will retrieve all images.


<div>

<h2>Show All Upload Images</h2>


<table border="1" cellpadding="2" cellspacing="0">
							
<tr>
									
<th>Sr.NO</th>


<th>Name</th>

							</tr>

					<?php $i=1; $sql="select * from `images`"; $qry=mysqli_query($con,$sql) or die(mysqli_error($con)); while($row=mysqli_fetch_array($qry)) { ?>
							
<tr>
									
<td><?php echo $i;?></td>


<td><img src="upload/<?php echo $row['file'];?>" width="100" height="100"></td>

							</tr>

				 <?php $i++; } ?>
					</table>

			</div>


Use the above code to fetch or retrieve or show images from the database table. If you have any question in the code or don’t understand any thing in the post do comment I will be happy to help you.

 

Download Source Code (Upload Images)

5 thoughts on “How To Upload Image In PHP And Store In Database”

  1. Unknown column ‘file’ in ‘field list’..
    How to fix it up.

    Reply
    • you can solve this error if you can check in the article again we have created a mysql table in database. so create a table like this in your database and with the given field also.

      Reply
  2. how to add two browse fields and upload both files.. i tried but it only uploading last added image.

    Reply
    • First you have to name each browser field different. then replicate the code for upload file. Here change the name as well of the variable.then try it.

      Reply
  3. Hello! I’m at work browsing your blog from my new
    iphone 4! Just wanted to say I love reading your blog and look forward
    to all your posts! Carry on the outstanding work!

    Reply

Leave a Comment

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