0
我在我的註冊表單中使用dropzoneJS。我有DropZone和一個單獨的輸入文件類型的窗體。我可以將其他輸入文本與dropzone一起發送,但輸入文件類型不會。我正在使用AJAX請求上傳文件併發送附加數據。用DropzoneJs發送一個單獨的輸入類型文件
這裏是我的形式
<form enctype="multipart/form-data">
<input type="text" name="name" id="name" placeholder="Full Name" >
<input type="email" name="email" id="email" placeholder="Email Address" >
<input type="password" name="password" id="password" >
<input type="file" name="avatar" id="avatar" >
<div class="dropzone-container file_upload" id="file_upload_container">
<div class="dz-message default-dropzone-text" data-dz-message>
<span class="text-default">Drag or click here to upload your credentials (i.e. Certificates, CV etc.)</span>
</div>
<div class="fallback">
<input name="file[]" type="file" id="file" multiple required />
</div>
</div>
<button type="button" id="submit">Submit</button>
</form>
,這裏是我的javascript代碼
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div.file_upload", {
url : sendData,
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
},
autoProcessQueue: false,
addRemoveLinks: true,
uploadMultiple: true,
parallelUploads: 100,
maxFiles: 100,
acceptedFiles: 'application/pdf, .doc, .docx, .pub, .jpeg, .jpg, .png, .gif, .xls, .xlsx, .ppt, .pptx',
maxFilesize: 500,
paramName: "file",
init: function(){
$("#submit").click(function(e) {
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
})
this.on("sendingmultiple", function(data, xhr, formData) {
formData.append("name", $("#name").val());
formData.append("email", $("#email").val());
formData.append("password",$('#password').val());
formData.append("avatar",$('#avatar'));
});
this.on("successmultiple", function(files, response) {
console.log(response);
});
this.on("errormultiple", function(files, response) {
myDropzone.removeAllFiles();
});
}
});