image extension + upload paths

[phpnooblet]

Hi all, im super stumped here. I have been trying to learn php for some time, and it is terribly confusing to me. I managed to make a product upload script for my shop, but I can't figure out how to process the product images to main page, and how to send them to product page.. So far when I upload the image of product via my backend inventory script it sends the pic to main page HOWEVER it puts it in JPG file extension... (Why does it do this when the file itself is a PNG?) It also sends the image to the product page which is great, but I have 2 distinct images that I need to be placed 1 image is a PNG(will only show a 200x200 preview image) I need it to be placed on main page, and 2nd image which is a JPG,(will be showing a full size of product) I need to be placed on product page. hope you guys can understand all that, I wrote it and I kinda don't lol  Anyway here is the PHP code that I have.

The first block of code is from my backend- add inventory script-

 

 if (isset($_POST['product_name'])) {
     $product_name = mysql_real_escape_string($_POST['product_name']);
    $price = mysql_real_escape_string($_POST['price']);
    $category = mysql_real_escape_string($_POST['category']);
    $subcategory = mysql_real_escape_string($_POST['subcategory']);
    $details = mysql_real_escape_string($_POST['details']);
    // See if that product name is an identical match to another product in the system
    $sql = mysql_query("SELECT id FROM products WHERE product_name='$product_name' LIMIT 1");
    $productMatch = mysql_num_rows($sql); // count the output amount
    if ($productMatch > 0) {
        echo 'Sorry you tried to place a duplicate "Product Name" into the system, <a href="inventory_list.php">click here</a>';
        exit();
    }
    // Add this product into the database now
    $sql = mysql_query("INSERT INTO products (product_name, price, details, category, subcategory, date_added)
        VALUES('$product_name','$price','$details','$category','$subcategory',now())") or die (mysql_error());
     $pid = mysql_insert_id();
    // Place image in the folder
    $newname = "$pid.jpg";
    move_uploaded_file( $_FILES['fileField']['tmp_name'], "../inventory_images/$newname");
    header("location: inventory_list.php");
    exit();
}
?>

This is the snippet of how I upload my product images.
 

<tr>
        <td align="right">Product Image</td>
        <td><label>
          <input type="file" name="fileField" id="fileField" />
        </label></td>
      </tr>      
      <tr>
        <td> </td>
        <td><label>
          <input type="submit" name="button" id="button" value="Add This Item Now" />
        </label></td>
      </tr>

I tried making dual image upload options in the form above , I was trying to make one upload to main page, and the other I was trying to MacGyver it to the product page, but couldn't make it happen.

Main page where the product will be sent after added via backend inventory script
 

<?php
// Run a select query to get my letest 6 items
// Connect to the MySQL database  
include "storescripts/connect_to_mysql.php";
$dynamicList = "";
$sql = mysql_query("SELECT * FROM products ORDER BY date_added DESC LIMIT 6");
$productCount = mysql_num_rows($sql); // count the output amount
if ($productCount > 0) {
  while($row = mysql_fetch_array($sql)){
             $id = $row["id"];
       $product_name = $row["product_name"];
       $price = $row["price"];
       $date_added = strftime("%b %d, %Y", strtotime($row["date_added"]));
       $dynamicList .= '<div class="ts"><a href="product.php?id=' . $id . '"><img src="inventory_images/' . $id . '.png" alt="' . $product_name . '" width="200" height="205" /><figcaption>'.$product_name.'</figcaption></a></div> ';
    }
} else {
  $dynamicList = "We have no products listed in our store yet";
}
mysql_close();
?>

And then I echo out the product list in my html container

<?php echo $dynamicList; ?>

Hope someone can enlighten me. Seems like im going around in circles on my own.

Edited May 9, 2014 by phpnooblet

[mac_gyver]

HOWEVER it puts it in JPG file extension...

 

 

that's what your code is naming the file when you upload it - $newname = "$pid.jpg";

 

if the file is always going to be .png, change that line of code to use .png. if the file can be any image type, your code will need to get the file extension from the uploaded image information and use it when naming the image file.

[phpnooblet]

that's what your code is naming the file when you upload it - $newname = "$pid.jpg";

 

if the file is always going to be .png, change that line of code to use .png. if the file can be any image type, your code will need to get the file extension from the uploaded image information and use it when naming the image file.

actually I have changed that to $pid.png before I posted this and it still outputs a .jpg file

[phpnooblet]

you can check out my rough draft site to see what i mean..  www.shirtstash.com  the sample image I uploaded via inventory script i made.. is originally  docbrown.png   then somehow gets labeled 32.jpg.... I guess all thats fine I just don't need it to show up on the product page.. I need it to link there but have another image there instead. I was thinking of making an extra field in my image upload script so I would have 2 image upload options 1 would be sent to index.php(sample image) and full sized display image be sent to the product page..but I have no Idea of how to make it direct to product.php?id=  instead of index.php

 

if that makes any sense

Edited May 9, 2014 by phpnooblet

[mac_gyver]

any image files you previously uploaded before you changed the line in the code are already named xx.jpg. you will need to physically rename them to xx.png or delete them and start over.

 

to LINK to a second larger image, you would use the smaller .png image as the content in a LINK -

<a href='xx.jpg'><img src='xx.png' alt=''><a>

[phpnooblet]

how would I put that in?

 

this is the code that gets executed on index.php

$dynamicList = "";

$dynamicList .= '<div class="ts"><a href="product.php?id=' . $id . '"><img src="inventory_images/' . $id . '.jpg" alt="' . $product_name . '" width="200" height="205" /><figcaption>'.$product_name.'</figcaption></a></div>';


<div id="container">
<?php echo $dynamicList; ?>  <---- thats the uploaded 200x205 sample image/images
</div>

btw the small image on main page shows the shirt art.. on product page the image will be different showing the art on the shirt.

[mac_gyver]

the example i give was so that the small image could be clicked on and displays the larger image. your code already has a link to the product.php?id=' . $id . ' page around the smaller image. so, the question becomes, what issue are you having in the product.php code that you need help with?

[phpnooblet]

When I uploaded the images they were getting sent to both index.php and product.php?id=   I only wanted the small display image on home page, where I would have countless others and when the user/customer clicks that image/images it take them to product page where I would have a totally different image there even a gallery maybe....  however using your tips I "MacGyver'd" it to show the image change..(i now upload the jpg, but I have to manually insert the png into image folder and name it the id of other image but attach .png and it works that way) still not exactly what I wanted but It will do the trick for now....  Thanks

 

 

btw if anyone know how to manipulate the backend upload script I posted so I can upload both images , and not have to manually insert the 2nd one via ftp.. would be so cool...

Edited May 9, 2014 by phpnooblet