In this image upload in php code with databases article, i make a HTML form that takes user profile an image as well as some users bio text. When the user selects any your profile an image and enters some Bio text and then simply clicks the submit button, the all the users data is submitted to the server side and save MySQL Database. PHP now grabs the image as well as saves it in a folder in the main upload project, and then saves the text in the mysql database together with a link pointing to the image in the profiles folder.
How to Upload Image into Database and Display it using PHP ?
Create a database called users_master and make a mysql table called users profiles with some added fields like as image type, file name, size or many more:
Also Read: Multiple Image Upload using PHP into MYSQL database
- id – int(11)
- image – varchar(255)
- file_imag_name – text
Make a file called profile.php and page the following code in it (the complete code):
profile.php:
- Make database connection
- Initialize message variable
- If upload button is clicked
- Get image name
- Get text
- image file directory
- execute query
<?php $db = mysqli_connect("localhost", "root", "", "users_master"); $msg = ""; if (isset($_POST['upload'])) { $image = $_FILES['image']['name']; $file_imag_name = mysqli_real_escape_string($db, $_POST['file_imag_name']); $target = "profiles/".basename($image); $sql = "INSERT INTO profiles (image, file_imag_name) VALUES ('$image', '$file_imag_name')"; mysqli_query($db, $sql); if (move_uploaded_file($_FILES['image']['tmp_name'], $target)) { $msg = "Good Luck Your Image uploaded successfully"; }else{ $msg = "Failed to upload image"; } } $result = mysqli_query($db, "SELECT * FROM profiles"); ?> <!DOCTYPE html> <html> <head> <title>Image Upload</title> <style type="text/css"> #content{ width: 50%; margin: 20px auto; border: 1px solid #cbcbcb; } form{ width: 50%; margin: 20px auto; } form div{ margin-top: 5px; } #img_div{ width: 80%; padding: 5px; margin: 15px auto; border: 1px solid #cbcbcb; } #img_div:after{ content: ""; display: block; clear: both; } img{ float: left; margin: 5px; width: 300px; height: 140px; } </style> </head> <body> <div id="content"> <?php while ($row = mysqli_fetch_array($result)) { echo "<div id='img_div'>"; echo "<img src='profiles/".$row['image']."' >"; echo "<p>".$row['file_imag_name']."</p>"; echo "</div>"; } ?> <form method="POST" action="profile.php" enctype="multipart/form-data"> <input type="hidden" name="size" value="99999999"> <div> <input type="file" name="image"> </div> <div> <textarea id="text" cols="50" rows="5" name="file_imag_name" placeholder="Say something about this profile..."></textarea> </div> <div> <button type="submit" name="upload">Save Image/File</button> </div> </form> </div> </body> </html>
And that’s all.
Also Read: PHP Simple Image Upload and Display Source Code
Be sure to HTML Form include the enctype in your HTML form tag. such as bellow Example:
<form method="POST" action="index.php" enctype="multipart/form-data">
Without the HTML attribute FORM enctype=”multipart/form-data”, the image or file won’t be uploaded. so must added the enctype is the encoding type that specifies format how the HTML form-data should be encoded when yout profile submitting the HTML form. Without it file or images uploads won’t work.