2016-09-28 1 views
1

複数のファイルをアップロードしようとして問題があります。私は2つのメソッドをajax経由でページに送ります。 1つはドロップゾーン、もう1つはXMLHttpRequestです。ボタンをクリックして送信するたびに、dropzoneである最初のメソッドに続いて私の要求が複製され、私のXMLHttpRequestは無視されます。だから、私はそれをformDataにバインドして送信する方法を見つけようとしています。JQuery:dropzone.jsを使用してformDataに複数のファイルを配置し、ajax経由で送信する方法

マイフォーム

 <form style="border:3px dashed #D9EDF7;" action="UploadImage" 
       class="dropzone dz-clickable" 
       id="my-awesome-dropzone" enctype="multipart/form-data"> 
       <div class="dz-message">Drop files here or click to upload. 
         <br> <span class="note">(Selected files are not 
       automatically uploaded.)</span> 
        </div> 
      <div class="fallback"> 
       <input name="file" id="filez" type="file" multiple/> 
      </div> 

     </form> 

私のJs

Dropzone.autoDiscover = false; 
var myDropzone = new Dropzone('#my-awesome-dropzone', { 
    url : '../ajax/ajax_add/ajax_addNEWContestant.php? 
    multipleImage=multiple_image&event_id='+event_id, 
    autoProcessQueue : false 
}); 

$(document).on('click','#addnewContestant', function(e){ 
    myDropzone.processQueue(); 

    var formdata = new FormData(); 
    formdata.append('file_addnew', file_addnew.files[0]); 
    //If there is a way, I just want to bind all the files from dropzone into formData 
    var data = new FormData(); 
    for(var b=0; b<imageContainer.length; b++){ 
     formdata.append('All_files_from_dropzone[], input_file.files[b]); 
    } 



    var param = "?event_id="+encodeURIComponent(event_id)+ 
      "&contestant_name="+encodeURIComponent(contestant_name)+ 
      "&contestant_lastName="+encodeURIComponent(contestant_lastName)+ 
      "&conAge="+encodeURIComponent(conAge)+ 
      "&hAddress="+encodeURIComponent(hAddress)+ 
      "&email_add="+encodeURIComponent(email_add)+ 
      "&conContactNum="+encodeURIComponent(conContactNum)+ 
      "&conDesc="+encodeURIComponent(conDesc)+ 
      "&conId_hidden="+encodeURIComponent(conId_hidden)+ 
      "&hidden_gender="+encodeURIComponent(hidden_gender)+ 
      "&random_gender="+encodeURIComponent(random_gender)+ 
      "&multipleImage="+encodeURIComponent(multipleImage); 


    beforeSend();    
    xhr = new XMLHttpRequest(); 
    var url = '../ajax/ajax_add/ajax_addNEWContestant.php'; 
    xhr.open('post', url+param, true); 

}); 

答えて

1

あなたはどのXHRは、自分

を作業する必要はありませんので、ドロップゾーンはすでに、ファイルと一緒に他のフォームフィールドを提出します
関連する問題