Problem with input type="file" in PHP form

[galahad2]

Hi, I have a PHP form which displays a set of images (1 to 50) for an item, within an admin area. I'm trying to set it up with a Browse facility for each image so that the admin can browse and pick a new image for upload, for any of the 50 images (or however many there are for that item).

Ideally I want the input to also display the name of the current image, but because I need to use type="file" it doesn't seem to be pulling in the value of the existing image to the form.

Also I can successfully browse for and upload a single photo, and it then displays fine within the form. However if I then try and upload another one for one of the other images, the previous image disappears- it seems that the value of the variable gets overwritten, again I'm wondering if this is because of type="file" being null unless I browse for the value?

In the form I have this in a table for each image:

<input name=\"_Pic1\" type=\"file\" value='$image1' /><img src=\"../images/carpictures/$image1\">

So as you can see the input browses for a new image to upload, whilst the image code next to it displays the current one (if it exists).

But if I upload Pic2, then try to upload Pic1 (for example), Pic2 disappears (not physically of course, but in the mySQL db)

What I need is for existing image values to be preserved when I upload new images for other variables- any idea if/how this can be done?

[Matthew1980]

Hi there galahad2,

I dont think it's wise to mix your quoting, if you open with single stay with single, if you open with double...

Yours should read:-

<input name=\"_Pic1\" type=\"file\" value=\"".$image1."\" /><img src=\"../images/carpictures/".$image1."\">

That will format the string correctly, as for your issue not too sure.. sounds like the paths don't match to me, you could store the location in a constant or a session and use that? again not too sure, I just saw the formatting and thought I would point it out :)

Cheers,
MRb

[rocknbil]

OK, well, there are two ways to slice this. One is to have an upload form/browse button by each slot, the other is to have a single upload form and list out all the images associated with an item (think shopping cart with multiple images per item, the functionality of which is what I think you're after.)

First, the file upload object is a weird duck, it's difficult to access via Javascript but in the context of your code, there is no advantage to populating it's value. Think about it: it inputs files from your system. So populating it with an image from your server means it won't be found on your computer (which is likely part of your problem.)

A bit of a burr for me, do not do this.
../images/

This will trap you and always come up with unexplained problems. If you move things around, you have to find them and change them. Always set your URL's (not server paths) as "start from root of the domain."

/images/

The optimum choice here is a list of the existing images with delete boxes by each, and a single upload field to add more. Here's a snippet from one of my projects. The two bits that are NOT HERE is a "sequence list" function, which creates a <select> allowing you to display the images in a specified sequence, and a newWindow Javascript function. Remove those bits or write them yourself.

// This creates a STRING containing all the images for
// $prod_id. Set prod_id=null for a "new product"
$images_list = getImageList('/php/myscript.php',$prod_id);

echo "
<form method="post" action="myscript.php">
<!-- set this based on adding a new item or updating -->
<input type="hidden" name="action" value="update">
<table>
$images_list
<tr><td colspan=\"3\">
<input type="submit" value="Update Images">
</td></tr>
</table>
</form>
";

 
function image_list($script,$prod_id) { 
 $images_table= IMAGES_TABLE; // database table for images, set from constant 
 $output= NULL; // Avoiding concatenation errors 
 $imgs_url= IMAGES_RELATIVE_DIR; // For URL's, /uploads, note not the same as full path 
 $imgs_path= USED_IMGS_DIR; // full path, /var/www/example.com/uploads 
 $ul_field= 'my-upload'; // Name of file object 
 $new_seq= 'img_seqence'; // See notes below 
 // 
 if ($prod_id > 0) { 
 // This puts all the ones with assigned numbers ABOVE unset values, which are 0 (zero) 
 $query = "select id,seq,file,original_fname from $images_table" . 
 " where prod_id=$prod_id order by sequence>0 desc, sequence";  
 $result=mysql_query("$select"); 
 if (!$result) { error("Cannot get images for product $prod_id: " . mysql_error()); } 
 while ($row=mysql_fetch_array($result)) { 
 // 
 $file = $row['file']; 
 $orig = $row['original_fname']; 
 $delname = 'del_img_' . $row['id']; // Name of our delete checkbox 
 $seqname = 'img_seq_' . $row['id']; // name of the sequence dropdown 
 $seqvalue = $row['sequence']; // To populate selected 
 // This is a function you will need to write, pretty simple. Generates select list 
 $seq_list = sequence_list($seqname,$images_table,$seqvalue); 
 // Use GD, if you must. :-) Note this is NOT the URL, full server path 
 $image = new Imagick("$imgs_path/$file"); 
 $w = $image->getImageWidth(); 
 $h = $image->getImageHeight(); 
 $image->destroy(); 
 // 
 // Note the use of $img_url below, and the newWin function, 
 // you'll have to write Javascript for it. 
 // My "newWin" accepts url, title, width, height, 
 // and returns false. 
 $output .= " 
 <tr> 
 <td><input type=\"checkbox\" name=\"$delname\" id=\"$delname\"></td> 
 <td colspan=\"2\"> 
 <a href=\"$imgs_url/$file\" 
 onclick=\"return newWin('','$imgs_url/$file','$orig',$w,$h);\">$orig</a></td> 
 <td class=\"$center_style\">$seq_list</td> 
 <td>&nbsp;</td> 
 </tr> 
 ";  
 } // End if $prod_id 
 mysql_free_result($result); 
 } // End while 
 // 
 if ($output) { 
 $output = " 
 <tr><td colspan=\"3\">&nbsp;</td></tr> 
 <tr> 
 <td class=\"$reverse_style\">DELETE</td> 
 <td colspan=\"2\">PREVIEW</td> 
 <td>SEQUENCE</td> 
 </tr> 
 $output 
 "; 
 } 
 // 
 // Re-get the sequence list for the NEW upload 
 $sequence_list = sequence_list($new_seq,$images_table,null); 
 // 
 $output .= " 
 <tr><td colspan=\"3\">&nbsp;</td></tr> 
 <tr> 
 <td nowrap><label for=\"$ul_field\">Add Image:</label></td> 
 <td colspan=\"2\" nowrap> 
 <input type=\"file\" name=\"$ul_field\" id=\"$ul_field\"> 
 <label for=\"$new_seq\">#</label> $sequence_list 
 </td> 
 </tr> 
 ";  
 return $output; 
}