PHP Dynamic Image Upload & Free Script Tutorial
This example demonstrate how to Upload Images to MySQL Database and then retrieve images from Database
Create a Database and Table for storing Images
Lets start by creating a Database & Table for storing images. In the SQL Code below, we have named our Databse cramerz and table name is tbl_img. Simply copy and paste this code in your MySQL Browser or PHPMyAdmin.
CREATE DATABASE cramerz;
use cramerz;
CREATE TABLE tbl_img(
`img_id` int(10) unsigned NOT NULL auto_increment PRIMARY KEY,
`img` varchar(250) NOT NULL,
)
Create a folder for storing Images and files
1. Create a folder in your localhost. Let's name it image_upload_script
2. Create a blank folder somewhere in your website Root Directory for storing images. Let's name this folder site_images
Create form for Image Upload
Create an HTML+PHP form for uploading images. Images will be uploaded to the folder (site_images) you already created on server. In Database table (tbl_img) we are only going to store the name of image that we are uploading. When we want to retrieve image, we will simple read the name from image table and display the image from Folder. Let's see how we can practically create the HTML+PHP Form for uploading images (for this example we will name this form upload_image_form.php)
<?php
//get the posted image when the submit button is clicked
if(isset($_POST['submit']))
{
$file = $_FILES['img_field'];
$file_name = $_FILES['img_field']['name'];
$file_tmp_name = $_FILES['img_field']['tmp_name'];
//save the image in img table
//connect to database
$con = mysql_connect("localhost", "root", "") or die('can't make connection : ' . mysql_error());
$db = mysql_select_db ("cramerz1", $con) or die ("Could not select database");
//save the name of image in table
$query = mysql_query("INSERT INTO tbl_img(img) VALUES('$file_name')") or die(mysql_error());
//upload images to this folder (complete path)
$path = "site_images/$file_name";
//use move_uploaded_file function to upload or move file to the given folder or path
if(move_uploaded_file($file_tmp_name, $path))
{
echo "File Successfully uploaded";
}
else
{
echo "There is something wrong in File Upload. Post the error message on Cramerz Forum to find solution !";
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<h1>Image Upload Form</h1>
<form action="" method="post" enctype="multipart/form-data" name="form1" id="form1">
Upload your image:<br />
<input name="img_field" type="file" id="img_field" /><br /><br />
<input type="submit" name="submit" id="submit" value="Submit" />
</form>
</body>
</html>
You can test this Image Upload file on your localhost by using this address
http://localhost/image_upload_script/upload_image_form.php
Retrieve Images from database
When we want to retrieve image, we will simple read the name from image table and display the image from Folder (site_images). In the code given here we have created a php file (show_images.php) for retrieving the images from database.
<?php
//connect to database
$connection = mysql_connect("localhost", "root", "") or die('can't make connection : ' . mysql_error());
$database = mysql_select_db ("cramerz1", $connection) or die ("Could not select database");
//save the name of image in table
$query = mysql_query("select * from tbl_img") or die(mysql_error());
//retrieve all image from database and store them in a variable
while($row = mysql_fetch_array($query))
{
$img_name = $row['img'];
$image = "<img src='site_images/$img_name' /><br />";
//store all images in one variable
$all_img = $all_img . $image;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<h1>Retrieve images from Datbase</h1>
<?php echo $all_img;?>
</body>
</html>
You can test this Image retreive page on your localhost by using this address
http://localhost/image_upload_script/show_images.php
You can also download our FREE script PHP Image Upload here. In case of any problems do not hesitate to post your error on Cramerz forum.
