Welcome folks today in this blog post we will be uploading image into server mysql database and displaying it in browser using html5 and css3 in php 7.All the full source code of the application is shown below.
Get Started
In order to get started you need to make an index.php file and copy paste the following code
index.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 |
<?php error_reporting(0); ?> <?php $msg = ""; // If upload button is clicked ... if (isset($_POST['upload'])) { $filename = $_FILES["uploadfile"]["name"]; $tempname = $_FILES["uploadfile"]["tmp_name"]; $folder = "image/".$filename; $db = mysqli_connect("localhost", "root", "", "photos"); // Get all the submitted data from the form $sql = "INSERT INTO image (filename) VALUES ('$filename')"; // Execute query mysqli_query($db, $sql); // Now let's move the uploaded image into the folder: image if (move_uploaded_file($tempname, $folder)) { $msg = "Image uploaded successfully"; }else{ $msg = "Failed to upload image"; } } $result = mysqli_query($db, "SELECT * FROM image"); ?> <!DOCTYPE html> <html> <head> <title>Image Upload</title> <style> #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> <div id="content"> <form method="POST" action="" enctype="multipart/form-data"> <input type="file" name="uploadfile" value=""/> <div> <button type="submit" name="upload">UPLOAD</button> </div> </form> </div> </body> </html> |
