JqueryファイルアップロードでマルチパートformDataをアップロード

Question

私はフォームを持っています。その中に2つの入力フィールドがあり、1つはタイプファイル（複数のファイル用）で、その他は日付です。

$('#uploadForm').fileupload({ 
 
     
 
     // formData: {adminDate: $("#adminDate").val()}, 
 
     add: function (e, data) {  
 
      data.url = 'http://localhost/myProject/upload'; 
 
      $.each(data.files,function(index,file){ 
 
       $('<p/>').text(file.name).appendTo("#fileList"); 
 
      }); 
 
      
 
      $("#btnSubmit").off('click').on('click', function() { 
 
       $("#bx_loader").removeClass('hidden');    
 
       $('#upload-parent-div').css("display", "block");   
 
       
 
       data.submit(); 
 
       resetProgressbar(); 
 
       
 
      }); 
 
     }, 
 
     progress: function (e, data) { 
 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
 
      console.log(progress); 
 
      $('<p/>').text(progress + '%'); 
 
     }, 
 
      
 
     dataType: 'json', 
 
     done: function (e, data) { 
 
      $.each(data.result.files, function (index, file) { 
 
       $('<p/>').text(file.name).appendTo("#fileList"); 
 
      }); 
 
     } 
 
    }); 
 
    $("#adminDate").datepicker({ 
 
    //dateFormat: 'dd/mm/yy', 
 
    dateFormat: 'yy-mm-dd', 
 
    showButtonPanel: true, 
 
    changeMonth: true, 
 
    changeYear: true 
 
    });

<form id="uploadForm" class="uploadForm" action="upload" method="post" enctype="multipart/form-data"> 
 

 
     <div class="form-group col-sm-offset-2"> 
 
      <label class="control-label col-sm-2">Input Data File:</label> 
 
      <div class="col-sm-5"> 
 
       <input type="file" name="files[]" id="fileupload" class="file form-control" accept=".csv,.zip" multiple required> 
 
       <div class="help-block help-block-error "></div>                
 
      </div> 
 
     </div> 
 
     <div class="form-group col-sm-offset-2"> 
 
      <label class="control-label col-sm-2">Date:</label> 
 
      <div class="col-sm-5"> 
 
       <input type="text" name="adminDate" id="adminDate" class="adminDate form-control" required> 
 
       <div class="help-block help-block-error "></div> 
 
      </div> 
 
     </div> 
 
     <div class="form-group col-sm-offset-2"> 
 
      <label class="control-label col-sm-2">Files:</label> 
 
      <div class="col-sm-5" id="fileList"> 
 
      </div> 
 
     </div> 
 
     <div class="form-group col-md-12 text-center"> 
 
      <button type="submit" id="btnSubmit" class="btn btn-success">Submit & Export</button> 
 
      <img id="bx_loader" class="hidden" src = "<?php echo Url::base() ?>/images/bx_loader.gif" /> 
 
     </div> 
 

 

 
    
 
    </form>

私は&エクスポート]を[送信]ボタンをクリックしたときに、このフォームを送信します。私は、コールが正常に私のアップロード機能に

public function actionUpload(){ 

    //echo 'takjsdf;ljasd;fl';exit; 


    if(!empty($_FILES)) { 
     $_SESSION['adminDate'] = $_POST['adminDate']; 
     echo '<pre>' ; 
     print_r($_FILES['files']); 
     echo '</pre>'; 

    } 


} 

としている問題は、私は、日付と一緒にすべてのファイルを取得したい、私はたったの$ _FILES配列の最後に選択したファイルを得ることができるということであることがわかります。また、（各選択されたファイルの）個々の進行状況バーでファイルのアップロードを実装したいが、私はこれに固執している。

デモjquery File Uploadプラグインを見て、選択したファイル数と同じ数のAjaxリクエストを表示できますが、私のコードでは達成できません。

どうすればこのisseを解決できますか？

Answer 1

このコードの一部は、すべての私の問題を解決し

$("#btnSubmit").on('click', function() { 
      $("#bx_loader").removeClass('hidden');    
      $('#upload-parent-div').css("display", "block");   

      data.submit(); 
      resetProgressbar(); 

     }); 

に変換する問題でした。