[FantomOptik]

I have a table set up for a store's inventory. I have 4 fields that I am using: 'name' 'size' 'type' 'photo'. The photo field is a path to a folder called /uploads. I am able to insert all of the fields into my table with no issues. If I do not echo the results to a table, my fields (including the actual image) display fine. I want the data to display in a table. I cannot get the image to display properly if I echo the data into a table. How can I get the image to display properly? The client will have the ability to access form.html and add the data, including uploading a photo. I can handle the thumbnailing and lightbox type stuff.

Here is my code:

form.html

<form enctype="multipart/form-data" action="add.php" method="POST"> 
 Product Name: <input type="text" name="name" /><br /> 
 Product Size: <input type="text" name ="size" /><br /> 
 Product Type: <input type="text" name ="type" /><br /> 
 Product Image: <input type="file" name="photo" /><br /> 
 <input type="submit" value="Add" /> 
</form>

add.php

<?php 
 
 //This is the directory where images will be saved 
 $target = "/Devel/uploads/"; 
 $target = $target . basename( $_FILES['photo']['name']); 
 
 //This gets all the other information from the form 
 $name=$_POST['name']; 
 $size=$_POST['size']; 
 $type=$_POST['type']; 
 $pic=($_FILES['photo']['name']); 
 
 // Connects to your Database 
 mysql_connect("xxxx", "xxxx", "xxxx") or die(mysql_error()) ; 
 mysql_select_db("Devel") or die(mysql_error()) ; 
 
 //Writes the information to the database 
 mysql_query("INSERT INTO `products` VALUES ('$name', '$size', '$type', '$pic')") ; 
 
 //Writes the photo to the server 
 if(move_uploaded_file($_FILES['photo']['tmp_name'], $target)) 
 { 
 
 //Tells you if its all ok 
 echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded, and your information has been added to the directory"; 
 } 
 else { 
 
 //Gives and error if its not 
 echo "Sorry, there was a problem uploading your file."; 
 } 
 ?>

display.php

<?php 
 // Connects to your Database 
 mysql_connect("xxxx", "xxxx", "xxxx") or die(mysql_error()) ; 
 mysql_select_db("Devel") or die(mysql_error()) ; 
 
 //Retrieves data from MySQL 
 $data = mysql_query("SELECT * FROM products") or die(mysql_error());

echo "<table border='1'>
<tr>
<th>Product Name</th>
<th>Product Size</th>
<th>Product Type</th>
<th>Product Image</th>
</tr>";
 
 //Puts it into an array 
 while($info = mysql_fetch_array( $data )) 
 { 
 
 //Outputs the image and other data
echo "<tr>"; 
Echo "<td>".$info['name'] . "</td>"; 
Echo "<td>".$info['size'] . "</td>"; 
Echo "<td>".$info['type'] . "</td>";
Echo "<td>".$info['photo'] . "</td>"; 
echo "</tr>";

 }
 echo "</table>";
mysql_close($con);
?>

[FantomOptik]

I just realized that I needed to show you the code that does indeed display the image properly (when not echoed out to a table:

//Outputs the image and other data
  
 Echo "<b>Name:</b> ".$info['name'] . "<br> "; 
 Echo "<b>Size:</b> ".$info['size'] . " <br>"; 
 Echo "<b>Type:</b> ".$info['type'] . " <br>";
 Echo "<img src=uploads/".$info['photo'] ."> <hr>"; 
 }

[codeprada]

First off your script is vulnerable to SQL injections and XSS attacks. Since it's for a client it's even more vital you handle those issues.

To prevent SQL injections use Prepared Statements. These are offered by PDO and MySQLi.

• Introduction to PDO - Dormilich
  
• Introduction to MySQLi and Prepared Statements - joeyadms

To prevent XSS attacks you must run the data that is being sent to the browser through one of the following:

• htmlentities
  
• htmlspecialchars

e.g.

echo "<b>Name:</b> ".htmlentities($info['name']) . "<br> ";

In your display.php why didn't you do

echo "<td><img src='uploads/". htmlentities($info['photo']) . "></td>";

You can't display an image without an image tag. You had the tag in your second post but not in the first.

[FantomOptik]

I understand about the security. I will take care of that before it goes into production. I am mainly trying to make sure that the base code does what I need it to before I start running validations and security on it.

[FantomOptik]

Brilliant!!!!! I made the small change:

 //Outputs the image and other data
echo "<tr>"; 
Echo "<td>".$info['name'] . "</td>"; 
Echo "<td>".$info['size'] . "</td>"; 
Echo "<td>".$info['type'] . "</td>";
echo "<td><img src=Devel/uploads/".$info['photo'] . "></td>"; 
echo "</tr>";
echo "</table>";

Now it displays the photo exactly as I wanted in the table.

Now I see that it is only pulling the first record. That table now has 2 records. It displays the first in the table as I wanted it, but the second is displaying the data, but it is placing outside of the table on the bottom. How do I get it to pull all of the records and display them all in the table?

[JackOfAllTrades]

You'll need to show the current code.

[FantomOptik]

JackOfAllTrades, on 07 February 2012 - 12:23 PM, said:

You'll need to show the current code.

Of course. I am sorry.

<?php 
 // Connects to your Database 
 mysql_connect("xxxx", "xxxx", "xxxx") or die(mysql_error()) ; 
 mysql_select_db("Devel") or die(mysql_error()) ; 
 
 //Retrieves data from MySQL 
 $data = mysql_query("SELECT * FROM products") or die(mysql_error());
 
 echo "<table border='1'>
<tr>
<th>Product Name</th>
<th>Product Size</th>
<th>Product Type</th>
<th>Product Image</th>
</tr>";

 //Puts it into an array 
 while($info = mysql_fetch_array( $data )) 
 { 
  
 //Outputs the image and other data
echo "<tr>"; 
Echo "<td>".$info['name'] . "</td>"; 
Echo "<td>".$info['size'] . "</td>"; 
Echo "<td>".$info['type'] . "</td>";
echo "<td><img src=Devel/uploads/".$info['photo'] . "></td>"; 
echo "</tr>";
echo "</table>"; 
 }
 mysql_close($con);
?>

Here is a screenshot:

[JackOfAllTrades]

You close the table within your while loop:

//Puts it into an array 
while($info = mysql_fetch_array( $data )) 
{ 
  
    //Outputs the image and other data
    echo "<tr>"; 
    Echo "<td>".$info['name'] . "</td>"; 
    Echo "<td>".$info['size'] . "</td>"; 
    Echo "<td>".$info['type'] . "</td>";
    echo "<td><img src=Devel/uploads/".$info['photo'] . "></td>"; 
    echo "</tr>";
    echo "</table>"; 
}

Note I also fixed your indentation. Please do yourself a favor and use an editor that will automatically indent your code, or indent it yourself. It will make your life much easier.

[FantomOptik]

JackOfAllTrades, on 07 February 2012 - 03:42 PM, said:

You close the table within your while loop:

//Puts it into an array 
while($info = mysql_fetch_array( $data )) 
{ 
  
    //Outputs the image and other data
    echo "<tr>"; 
    Echo "<td>".$info['name'] . "</td>"; 
    Echo "<td>".$info['size'] . "</td>"; 
    Echo "<td>".$info['type'] . "</td>";
    echo "<td><img src=Devel/uploads/".$info['photo'] . "></td>"; 
    echo "</tr>";
    echo "</table>"; 
}

Note I also fixed your indentation. Please do yourself a favor and use an editor that will automatically indent your code, or indent it yourself. It will make your life much easier.

Thank you so much. This works exactly how I needed it. I understand about the security and the indentation. I just wanted to get the code to work the way I needed it to before I went at everything else.

I really appreciate all of the information and the reference links you provided.