Jump to content

Show images from MySQL database using JQUERY


Recommended Posts

So recently I got my hands on one of youtube videos, it's quit old, and the guy explaining how to create a form for uploading image and all data that is connected with it, to MySQL and then showing on your web site. So everything is ok, but webpage does not display any images, it just show me white picture frame with picture icon on the top.

 

This is my connection file with database:

<?php
$hostname_phpimage = "***";
$username_phpimage = "***";
$password_phpimage = "***";
$database_phpimage = "***";

// Create connection
$inkedmen_marko = mysql_pconnect($hostname_phpimage, $username_phpimage, $password_phpimage);

// Check connection
if ($phpimage->connect_error) {
    die("Connection failed: " . $phpimage->connect_error);
}
?>

Then the file that uploads the images:

<?php require_once('php/connect.php');
if($_POST['submit'])
{
	$name=basename($_FILES['file_upload']['name']);
        $t_name=$_FILES['file_upload']['tmp_name'];
        $dir='/home4/inkedmen/public_html/images';
        $cat=$_POST['cat'];
        if(move_uploaded_file($t_name,$dir."/".$name))
                {
            mysql_select_db($database_phpimage, $inkedmen_marko);
            $qur="insert into anglija (mid, cid, name, path) values ('','$cat','$name','/home4/inkedmen/public_html/images/$name')";
            $res=mysql_query($qur,$inkedmen_marko);
            
            echo'file upl success';
                }
        else {
            echo 'not uploaded';
        }
}
?>

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="file_upload"/>
cat_id <input type="text" name="cat" /><br/>
<input type="submit" name="submit" value="upload"/>

</form>
</body>
</html>

Then this one shows me what countries I have in one of the data base tables, so there is two england and slovenia, they both have a separate id that I have to type when uploading an image:

<?php require_once('php/connect.php');
 mysql_select_db($database_phpimage, $inkedmen_marko);
 $qur="select * from cat";
 $res=mysql_query($qur,$inkedmen_marko);
?>
<html>
    <head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    
    <body>
        <?php while($row= mysql_fetch_array($res)) { ?>
        <h1><a href="image.php?cid=<?php echo $row['id']?>"><?php echo $row['name'] ?> </a></h1><br/>
        <?php } ?>
    </body>
</html>

And finally, when I push on each country it directs me to the pictures that are connected with that countries according to the id given:

<?php require_once('php/connect.php');
 mysql_select_db($database_phpimage, $inkedmen_marko);
 $id=$_GET['cid'];
 $qur="select * from anglija where cid='$id'";
 $res=mysql_query($qur,$inkedmen_marko);
?>

<html>
    <head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    
    <body>
        <?php while ($row=mysql_fetch_array($res)){ ?>
        <img src="<?php echo $row['path'] ?>" width="300px" height="200px"> <br/>
        <?php } ?>
    </body>
</html>

So in the end it directs me to the pictures, but I can't see the pictures, it's just white windows with icon on the top. The pictures uploads to the image folder, the id, names of the file, path also uploads good, but somehow I can't show the images. I know it should be something small, but I can't figure it out. Maybe someone have any ideas????

 

Link to post
Share on other sites

That code is definitely old, that's not going to work in the latest version of PHP and it's open to database attacks. You should be using something like PDO with prepared statements when you're interacting with a database. There's also very little error checking with the file upload, the PHP manual explains how to check for file upload errors and any good tutorial should have that as well. For some reason some tutorials like to skip things like verifying that everything worked, I would skip those tutorials.

 

For starters, add this to the top of your code to make sure that it's going to show any error:

 

ini_set('display_errors', 1);
error_reporting(E_ALL);
Other than that, you need to verify what is happening. Print out the values that you're getting from $_GET or $_POST so that you can verify that they are correct, check the HTML code in the browser to see what PHP is printing, etc. It looks like you're saving the local filesystem path in the database, and that's not going to work to display the image in a web page. An img tag needs the HTTP path, not the local disk path.
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...