PHP将带有标题的多个文件上传到MySQL

时间:2015-07-29 23:33:39

标签: javascript php jquery html mysql

我写了一个脚本来存储我的数据库中的图像。图像具有也上载和存储的标题。这很容易上班。我有一个jquery函数设置,每次单击一个按钮时添加一个新的文件输入和标题输入。这也有效。

什么不起作用我的PHP由于某种原因没有上传多个文件。

有人能告诉我我做错了吗?

谢谢:)

HTML:

<form id="uploadMultiple" method="post" action="/scripts/php/imageUploadTest" enctype="multipart/form-data">
  <table class="fileUploadTable" id="uploadArea" cellspacing="0">
   <tr>
    <td>
     <label for="imageFile">Image:</label> 
     <input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif">
    </td>
    <td>
     <label for="imageCaption">Image Caption:</label>
     <input type="text" name="imageCaption">
    </td>
    <td width="150px">
     &nbsp;
    </td>
   </tr>
   <tr id="uploadSubmission">
    <td>
     <input type="submit" value="Upload More" id="uploadMore">
    </td>
    <td>
     <input type="submit" value="Submit" name="addImage">
    </td>
    <td width="150px">
     &nbsp;
    </td>
   </tr>
  </table>
 </form>

用于添加新元素的JQuery:

$(function() {
        var scntDiv = $('#uploadArea');
        var i = $('#p_scents tr td').size() + 1;

        $('#uploadMore').live('click', function() {
                $('<tr><td><label for="imageFile">Image:</label> <input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif"></td><td><label for="imageCaption">Image Caption:</label> <input type="text" name="imageCaption"></td><td><a href="#" class="removeUpload" width="150px" style="text-align: center">Remove</a></td></tr>').insertBefore( $('#uploadSubmission') );
                i++;
                return false;
        });

        $('.removeUpload').live('click', function() { 
                if( i > 1 ) {
                        $(this).parents('tr').remove();
                        i--;
                }
                return false;
        });
});

最后是PHP:

require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');


$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
  die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");

foreach($_FILES['imageFile'] as $file){ 
$caption = $_POST['imageCaption'];
$uploadDir = 'http://www.example.com/images/'.'gallery/'; 
$fileName = $_FILES['imageFile']['name'];
$filePath = $uploadDir . $fileName;

if(move_uploaded_file($_FILES["imageFile"]["tmp_name"],$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$_FILES["imageFile"]["name"]))
{
$query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
if(mysqli_query($conn, $query_image))
{
echo "Stored in: " . "gallery/" . $_FILES["imageFile"]["name"];
}
else
{
echo 'File name not stored in database';
}
}
}

我希望通过我的foreach循环让它适用于多张图片,但即使我选择了4张图片,也只上传了一张图片。

编辑:

我已经尝试将我的代码修改为这个并且它也不起作用,但是看一下教程,这似乎比我以前的代码更加正确:

require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');


$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
  die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");

foreach($_FILES['imageFile'] as $key => $name){ 
$caption = $_POST['imageCaption'];
$uploadDir = 'http://www.jollyrogerpcs.com/images/'.'gallery/'; 
$fileName = $key.$_FILES['imageFile']['name'][$key];
$file_size = $_FILES['files']['size'][$key];
$file_tmp = $_FILES['files']['tmp_name'][$key];
$file_type= $_FILES['files']['type'][$key];
$filePath = $uploadDir . $fileName;

if(move_uploaded_file($file_tmp,$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$fileName))
{
$query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
if(mysqli_query($conn, $query_image))
{
echo "Stored in: " . "gallery/" . $_FILES["imageFile"]["name"];
}
else
{
echo 'File name not stored in database';
}
}
}

我还在需要它们的HTML输入元素的名称中添加了[]

在frz3993的帮助下,这里是完整的工作代码:

require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');


$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
  die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");

$uploadDir = 'http://www.example.com/images/gallery/'; 

foreach ($_FILES['imageFile']['name'] as $key => $value) {

    if($_FILES['imageFile']['error'][$key] == UPLOAD_ERR_OK){

         $caption = $_POST['imageCaption'][$key];
         $fileName = $_FILES['imageFile']['name'][$key];
         $file_size = $_FILES['imageFile']['size'][$key];
         $file_tmp = $_FILES['imageFile']['tmp_name'][$key];
         $file_type= $_FILES['imageFile']['type'][$key];
         $filePath = $uploadDir.$fileName;

        if(move_uploaded_file($file_tmp,$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$fileName))
{
        $query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
mysqli_query($conn, $query_image);

    }        
 }
}

2 个答案:

答案 0 :(得分:2)

就像我在评论$_FILES['imageFile']中写的那样,它将包含有关上传文件的一些信息。我将使用四个元素(因为我不记得其中还有其他内容)

array('name' => fileName, 'tmp_name' => temporaryName, 'error' => uploadError, 'size' => theFileSize);

当您在foreach上使用$_FILES时,实际上正在循环遍历这四个元素,因此循环中的行正在运行四次。

基本上,您无法上传或发布具有相同名称的输入,因为它将被覆盖。但您可以使用数组作为输入名称。对于您的案例name=imageFile[]name=imageCaption[]。假设您有两个上传image1.jpgimage2.jpg,其标题为caption1caption2;

$_FILES['imageFile']$_POST['imageCaption']结构将如下:

$_FILES['imageFile'] = array('name' => array(
    0 => 'image1.jpg',
    1 => 'image2.jpg'
));

$_POST['imageCaption'][0] = caption1;
$_POST['imageCaption'][1] = caption2;

所以你的foreach循环应该看起来像

$uploadDir = 'http://www.jollyrogerpcs.com/images/gallery/'; 

foreach ($_FILES['imageFile']['name'] as $key => $value) {

    if($_FILES['imageFile']['error'][$key] == UPLOAD_ERR_OK){

         $caption = $_POST['imageCaption'][$key];
         $fileName = $_FILES['imageFile']['name'][$key];
         $file_size = $_FILES['imageFile']['size'][$key];
         $file_tmp = $_FILES['imageFile']['tmp_name'][$key];
         $file_type= $_FILES['imageFile']['type'][$key];
         $filePath = $uploadDir.$fileName;

         //your move uploaded file and sql query goes here

    }        

}

答案 1 :(得分:0)

值得注意的是.size()函数在较新的jQuery版本中消失了(我用3.1.1测试过);你可以使用.length(注意.length不是一个函数,不需要括号)。

同样,在较新版本的jQuery中使用.live并不好,应该更新为.on()

我的固定代码,从jQuery 3.1.1开始,是:

$(function() {
    var scntDiv = $('#uploadArea');
    var i = $('#p_scents tr td').length + 1;

    $(document).on('click', '#uploadMore', function() {
        $('<tr><td><label for="imageFile">Image:</label> <input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif"></td><td><label for="imageCaption">Image Caption:</label> <input type="text" name="imageCaption"></td><td><a href="#" class="removeUpload" width="150px" style="text-align: center">Remove</a></td></tr>').insertBefore( $('#uploadSubmission') );
        i++;
        return false;
    });


    $(document).on('click', '.removeUpload', function() {
        if( i > 1 ) {
            $(this).parents('tr').remove();
            i--;
        }
        return false;
    });

});