Beim Hochladen mehrerer Dateien mit AJAX wird keine Datei hochgeladen.

Question

Ich versuche, mehrere Dateien mit nur 1 AJAX-Anfrage hochzuladen. Aber ich bin vor ein paar Probleme und sie sind:

UPDATE

• Keine Datei auf den Server hochgeladen werden
• Es scheint mir, dass mehrere AJAX-Anforderungen wie AJAX gemacht werden ist innerhalb der for-Schleife.

Wie sortiere ich diese Probleme?

HTML

<!--<form id="fileupload" method="POST" enctype="multipart/form-data">--> 
    <input type="file" multiple name="uploadfile[]" id="uploadfile" /> 
<!--</form>--> 

JS

$("#uploadfile").change(function(){ 
    //submit the form here 
    //$('#fileupload').submit(); 
    var files = $("#uploadfile")[0].files; 
    for (var i = 0; i < files.length; i++){ 
     //alert(files[i].name); 
     var data = files[i].name; 
     $.ajax({ 
      type:'POST', 
      url: 'mupld.php', 
      data: data 
     }); 
    } 

//var files = $('#uploadfile').prop("files"); //files will be a FileList object. 
//alert(files); 
//var names = $.map(files, function(val) { return val.name; }); //names is an array of strings (file names) 

});

PHP

<?php 
if(isset($_FILES['uploadfile'])){ 

    $errors= array(); 

    foreach($_FILES['uploadfile']['tmp_name'] as $key => $tmp_name){ 
     $file_name = $key.$_FILES['uploadfile']['name'][$key]; 
     $file_size =$_FILES['uploadfile']['size'][$key]; 
     $file_tmp =$_FILES['uploadfile']['tmp_name'][$key]; 
     $file_type=$_FILES['uploadfile']['type'][$key]; 
     if($file_size > 2097152){ 
      $errors[]='File size must be less than 2 MB'; 
     }  

     //$query="INSERT into upload_data (`USER_ID`,`FILE_NAME`,`FILE_SIZE`,`FILE_TYPE`) VALUES('$user_id','$file_name','$file_size','$file_type'); "; 

     $desired_dir="storage"; 

     if(empty($errors)==true){ 
      if(is_dir($desired_dir)==false){ 
       mkdir("$desired_dir", 0700);  // Create directory if it does not exist 
      } 

      if(is_dir("$desired_dir/".$file_name)==false){ 
       move_uploaded_file($file_tmp,"$desired_dir/".$file_name); 
      } 
      else{         // rename the file if another one exist 
       $new_dir="$desired_dir/".$file_name.time(); 
       rename($file_tmp,$new_dir) ;    
      } 
     //mysql_query($query);   
     } 
     else{ 
       print_r($errors); 
     } 
    } 
    if(empty($error)){ 
     echo "Success"; 
    } 
} 
?> 

Answer 1

js in Frage erscheint nicht File Objekt, sondern File.name bei var data = files[i].name; hochladen? <!-- --> ist nicht gültig Kommentar in javascript

Versuchen FormData()

$("#uploadfile").change(function() { 
    var files = $("#fileupload")[0]; 
     $.ajax({ 
      type:"POST", 
      url: "mupld.php", 
      data: new FormData(files), 
      processData: false, 
      contentType: false 
     }); 
}); 

Answer 2

Verwenden Sie es

AJAX File Upload plugin

<pre> 
    $("#uploadfile").change(function(){ 
    $.ajaxFileUpload 
    (
     { 
      url:'mupld.php', 
      secureuri:false, 
      fileElementId:'uploadfile[]', 
      dataType: 'html', 
      data:{}, 
      success: function (data, status) 
      { 

      }, 
      error: function (data, status, e) 
      { 

      } 
     } 
    ); 
    }); 
</pre>