i have created a photography website with an admin page that uploads photos to different categories in a mysql table. This much works, but i can only upload one file at a time and i'd like to be able to select multiple images.
Here's the form
<form action="index.php" enctype="multipart/form-data" name="myForm" id="myForm" method="post">
<select name="category" id="category">
<option value="Nature">Nature</option>
<option value="People">People</option>
<option value="Abstract">Abstract</option>
</select>
<input type="file" name="fileField" id="fileField" />
<input type="submit" name="submit" id="submit" value="Add Images" />
</form>
And here's the php for parsing the form
if (isset($_POST['submit'])) {
$category = mysql_real_escape_string($_POST['category']);
// Add this product into the database now
$sql = mysql_query("INSERT INTO images (category, date_added)
VALUES('$category',now())") or die (mysql_error());
$pid = mysql_insert_id();
// Place image in the folder
$newname = "$pid.jpg";
move_uploaded_file( $_FILES['fileField']['tmp_name'], "../photos/$newname");
header("location: thumbnail_generator.php");
exit();
}
I looked into the html5 file input method, and as far as i can tell, i can change the input as folllows:
<input type="file" name="fileField[]" id="fileField" multiple="multiple"/>
This allows me to select multiple files on the site, but i can't figure out how to implement this into my php. Any help would be much appreciated.
You are probably looking for something like uploadify or swfupload or plupload.
<form method="post" action="" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="500000">
Add Photos <input multiple="true" onchange="this.form.submit()" type="file" name="photos[]"/>
<input type="hidden" name="sendfiles" value="Send Files" />
</form>
<?php
define ("MAX_SIZE","5000");
function getExtension($str)
{
$i = strrpos($str,".");
if (!$i) { return ""; }
$l = strlen($str) - $i;
$ext = substr($str,$i+1,$l);
return $ext;
}
$errors=0;
if(isset($_POST['sendfiles']))
{
$uploaddir = "files/"; //a directory inside
foreach ($_FILES['photos']['name'] as $name => $value)
{
$filename = stripslashes($_FILES['photos']['name'][$name]);
//get the extension of the file in a lower case format
$extension = getExtension($filename);
$extension = strtolower($extension);
echo "\n This is the extension: ",$extension;
if (($extension != "jpg") && ($extension != "jpeg") && ($extension != "png") && ($extension != "gif"))
{
//print error message
?>
<h4>Unknown extension!</h4>
<?php
$errors=1;
}
else
{
$size=filesize($_FILES['photos']['tmp_name'][$name]);
if ($size > MAX_SIZE*1024)
{
?>
<h4>You have exceeded the size limit!</h4>
<?php
$errors=1;
}
$image_name=$filename.'.'.$extension;
$newname="files/".$image_name;
$copied = copy($_FILES['photos']['tmp_name'][$name], $newname);
if (!$copied)
{
?>
<h4>Copy unsuccessfull!</h4>
<?php
$errors=1;
}
}
}
//echo "Images uploaded successfully";
}
//mysql_close($dbhandle);
?>
It works as-if there were multiple file fieldsDocs, it's transparent to PHP. Here is some simple example code:
<html>
<body>
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="fileField[]" id="fileField" multiple="multiple">
<input type="text" name="test" value="test">
<input type="submit" name="submit">
</form>
</body>
</html>
<?php
var_dump($_FILES, $_POST);
Store it on your host and request it. You can then play around with it, it will show you the structure of the $_FILES
and $_POST
array.
Example output:
array
'fileField' =>
array
'name' =>
array
0 => string 'hakre-iterator-fun-cut-top.png' (length=30)
1 => string 'hakre-iterator-fun-cut-middle.png' (length=33)
'type' =>
array
0 => string 'image/png' (length=9)
1 => string 'image/png' (length=9)
'tmp_name' =>
array
0 => string '/tmp/php1A2.tmp' (length=15)
1 => string '/tmp/php1A3.tmp' (length=15)
'error' =>
array
0 => int 0
1 => int 0
'size' =>
array
0 => int 234001
1 => int 213058
array
'test' => string 'test' (length=4)
'submit' => string 'Submit' (length=6)
See Uploading multiple filesDocs.
Try out this.
http://www.uploadify.com/demos/
Uploadify is a powerful and highly-customizable file upload script. Uploadify is easy to get up and running with
minimal effort and little coding knowledge.
you will receive an array of images -> fileField[]. Just iterate through this array and add the images the same way you were adding them before. Also, I'd suggest using this, very nice script - http://valums.com/ajax-upload/
EDIT: Just don't forget to implement at least some security checks, like min and max upload size, file extensions and mime-type checking! Even if it's for the back-end, this could still lead to unpleasant events.
Wouldn't something like creating an array work too? So what he could do is
$images = array();
Then in his form just add a add to image list button? From there he just keep adding as many images as he wants and then just iterate over the array and add to the database?