Uploading Multiple PHP Files jQuery

Question

Uploading Multiple PHP Files jQuery

Navigation

#1 by (0 votes)

1

I would like to send multiple files via post using jQuery, I tried several codes and I could not, I would like you to help me.

I have this form:

HTML - index.html

<div class="arquivo" style="display: none;">
   <form name="form-file" id="form-file" method="post" enctype="multipart/form-data">
        <input type="file" multiple id="userfile" name="userfile[]" />
   </form>
</div>

Javascript - send.js

$('#userfile').on('change', function (event) {
    var data = new FormData(), file = [];
    var files = event.target.files;
    $.each(files, function(key, val) {
        file[key] = val;
    });

    data.append('file', file);
    $.ajax({

        url: 'upload1.php',
        type: 'post',
        data:  data,
        contentType: false,
        cache: false,
        processData: false,
        beforeSend: carregando,
        success: function (result) {
            // alert('Result: '+result);
            $('#uploaded-files').html(result);
            // sucesso('Arquivos enviados com sucesso!');
        }
    });
});

PHP

<?php
$path="arquivos/"; //server path
$result = '';
if(isset($_FILES['userfile']['name'][0])){
    //echo $_FILES['userfile']['name'][0];
    foreach ($_FILES['userfile']['name'] as $key => $file){
        $file_name = 'arquivos/'.$_FILES['userfile']['name'][$key];
        if(move_uploaded_file($_FILES['userfile']['tmp_name'][$key], $file_name)){
            // $result .= "<div class='image'><img src='${file_name}'></div>";
            $result .= "${file_name}<br />";
        }
    }

}else{
    $result =  "Nada";
}
?>

But in jQuery only returns "Nothing".

This same PHP code is used in Drag and Drop mode and works

Thanks in advance.

php html jquery ajax

asked by anonymous 17.03.2017 / 13:30

1 answer

Insert a same image multiple times through the input file Variable value does not seem to change according to the loop

score 0 · Accepted Answer

HTML - index.html

 <div>
        <form method="post" enctype="multipart/form-data">
            Selecione um ficheiro:
            <input type="file" name="fileToUpload[]" multiple accept="application/pdf">
            <input type="submit" value="Upload Image" name="submit" id="myFile" >
        </form>
    </div>

Javascript

$(document).ready(function () {//
           $("form").submit(function(evt){
               var formData = new FormData($(this)[0]);
                $.ajax({
                    url: 'php/upload.php',
                    type: 'post',
                    data: formData,
                    contentType: false,
                    cache: false,
                    processData: false,                        
                    success: function (result) {
                        alert('Result: ' + result);
                    }
                });

            });

PHP

<?php
define('ROOTPATH', dirname(__DIR__) . '\upload\');
$result = '';
$property_images = $_FILES['fileToUpload']['name'];
if (!empty($property_images)) {
    for ($up = 0; $up < count($property_images); $up++) {
        if (move_uploaded_file($_FILES['fileToUpload']['tmp_name'][$up], ROOTPATH . $_FILES['fileToUpload']['name'][$up])) {
            echo $result = "OK";
        }
    }
} else {
    echo $result = "Nada";
}
?>