Uploading multiple images with one input field

2019-01-28 01:33发布

站内问答 / PHP
949 6 6

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.

6条回答
\"骚年 ilove
2楼-- · 2019-01-28 02:13

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.

查看更多
0人赞 添加讨论(0) 举报
兄弟一词,经得起流年.
3楼-- · 2019-01-28 02:13

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.

查看更多
0人赞 添加讨论(0) 举报
\"骚年 ilove
4楼-- · 2019-01-28 02:18

It works as-if there were multiple file fields­Docs, 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 files­Docs.

查看更多
0人赞 添加讨论(0) 举报
干净又极端
5楼-- · 2019-01-28 02:23

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?

查看更多
0人赞 添加讨论(0) 举报
霸刀☆藐视天下
6楼-- · 2019-01-28 02:32 
<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);
?>
查看更多
0人赞 添加讨论(0) 举报
唯我独甜
7楼-- · 2019-01-28 02:33

You are probably looking for something like uploadify or swfupload or plupload.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)