JQuery：發送多個文件和參數得到錯誤：已連接的Dropzone

我試圖從輸入字段使用dropzone一起發送多個文件的值。不幸的是，我得到一個錯誤說，已經附加了dropzone。JQuery：發送多個文件和參數得到錯誤：已連接的Dropzone

這裏是我的代碼

$(document).on('click','#addContestant',function(e){ 
e.preventDefault(); 
var random_gender = $('#randomGender').val(); 
    var contestant_name = $('#contestant_name').val(); 
    var contestant_lastName = $('#contestant_lastName').val(); 
    var conAge = $('#conAge').val(); 
    var hAddress = $('#hAddress').val(); 
    var email_add = $('#email_add').val(); 
    var conContactNum = $('#conContactNum').val(); 
    var conDesc = $('#conDesc').val(); 
    var hidden_gender = $('#hidden_gender').val(); 
    var conId_hidden = $('#conId_hidden').val(); // the contestant prima id 

    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); 

    Dropzone.autoDiscover = false; 
    var myDropzone = new Dropzone('form#my-awesome-dropzone', { 
     url : '../ajax/ajax_add/ajax_addNEWContestant.php?'+param, 
     maxFilesize: 3.0, 
     maxFiles: 4, 
     parallelUploads: 10000, 
     uploadMultiple: true, 
     autoProcessQueue: false 
    }); 

    });

來源

2016-09-28 Echoing Throughout Tel Numara

你加入到懸浮窗點擊事件，這意味着每一個項目被點擊的時間內的表單元素，這個代碼運行。每當您第一次點擊它時就會給出錯誤消息，因爲正如它所說的，Dropzone已經被添加到目標元素中。你必須要麼a）在'domready'上添加dropzone而不是點擊，或者b）如果你要在代碼的其他地方動態添加一個新字段，只需要將它添加到字段本身，而不是表單。 –

如果我使用a。我的輸入字段值不會發送。只有來自dropzone的文件，我如何實現文件和輸入字段值一起。 –

您可以使用'

克里斯·貝克是正確的，在這裏你會附上同一元素在多個懸浮窗，誰就會失敗。

嘗試初始化dropzone一次並使用事件'發送'。

// Dropzone config 
Dropzone.autoDiscover = false; 

// To run when dom is ready 
$(document).ready(function(){ 

    // Manual Dropzone init 
    var myDropzone = new Dropzone('form#my-awesome-dropzone', { 
     url : '../ajax/ajax_add/ajax_addNEWContestant.php', 
     maxFilesize: 3.0, 
     ... 
    }); 

    // Add dynamic event on sending 
    myDropzone.on('sending', function(file, xhr, formData){ 
     // Fetch values to send 
     var contestant_name = $('#contestant_name').val(); 
     ... 

     // Add it to request data send by Dropzone 
     formData.append('event_id', encodeURIComponent(event_id)); 
     formData.append('contestant_name', encodeURIComponent(contestant_name)); 
     ... 
    }); 

});

，或者直接在初始化

// Dropzone config 
Dropzone.autoDiscover = false; 

// To run when dom is ready 
$(document).ready(function(){ 

    // Manual Dropzone init 
    var myDropzone = new Dropzone('form#my-awesome-dropzone', { 
     url : '../ajax/ajax_add/ajax_addNEWContestant.php', 
     maxFilesize: 3.0, 
     ... 
     sending: function(file, xhr, formData){ 
      // Fetch values to send 
      var contestant_name = $('#contestant_name').val(); 
      ... 

      // Add it to request data send by Dropzone 
      formData.append('event_id', encodeURIComponent(event_id)); 
      formData.append('contestant_name', encodeURIComponent(contestant_name)); 
      ... 
     } 

    }); 

});

來源

2017-02-15 13:58:01 Camille

JQuery：發送多個文件和參數得到錯誤：已連接的Dropzone

回答

相關問題