Question

我在注册表中使用了dropzoneJS。我有DropZone表单和单独的输入文件类型。我可以将其他输入文本与dropzone一起发送，但输入文件类型不是。我正在使用AJAX请求上传文件并发送其他数据。

这是我的表格

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

Answer 1

好的，我知道了，我试图将对象发送到API而不是实际文件，所以我更换了

formData.append("avatar",$('#avatar'));

带

formData.append("avatar",$('#avatar')[0].files[0]);

它有效！

使用DropzoneJs发送单独的输入类型文件

1 个答案: