DropZonejs: Отправить форму без файлов

Ответ 1

Используйте следующее:

$('input[type="submit"]').on("click", function (e) {

                    e.preventDefault();
                    e.stopPropagation();

                    var form = $(this).closest('#dropzone-form');
                    if (form.valid() == true) { 
                        if (myDropzone.getQueuedFiles().length > 0) {                        
                            myDropzone.processQueue();  
                        } else {                       
                            myDropzone.uploadFiles([]); //send empty 
                        }                                    
                    }               
                });

Ссылка: https://github.com/enyo/dropzone/issues/418

Ответ 2

В зависимости от вашей ситуации вы можете просто отправить форму:

if (myDropzone.getQueuedFiles().length > 0) {                        
   myDropzone.processQueue();  
} else {                       
   $("#my_form").submit();
}

Ответ 3

Я попробовал ответ Matija Grcic и получил следующую ошибку:

Uncaught TypeError: Cannot read property 'name' of undefined

И я не хотел изменять исходный код dropzone, поэтому я сделал следующее:

        if (myDropzone.getQueuedFiles().length > 0) {                        
            myDropzone.processQueue();  
        } else {                       
            myDropzone.uploadFiles([{name:'nofiles'}]); //send empty 
        }                                    

Примечание. Я передаю объект внутри массива функции uploadFiles.

Затем я проверяю серверную сторону, если имя!= 'nofiles' загружает файл.

Ответ 4

Первый подход для меня слишком дорог, я бы не хотел погружаться в исходный код и изменять его,

Если вы похожи на меня, используйте это.

function submitMyFormWithData(url)
    {
        formData = new FormData();
        //formData.append('nameOfInputField', $('input[name="nameOfInputField"]').val() );

        $.ajax({
                url: url,
                data: formData,
                processData: false,
                contentType: false,
                type: 'POST',

                success: function(data){
                alert(data);
                }
        });
    }

И в вашей dropzone script

$("#submit").on("click", function(e) {
                      // Make sure that the form isn't actually being sent.
                      e.preventDefault();
                      e.stopPropagation();

                        if (myDropzone.getQueuedFiles().length > 0)
                        {                        
                                myDropzone.processQueue();  
                        } else {                 
                                submitMyFormWithData(ajaxURL);
                        }     

                    });

Ответ 5

Я успешно использовал:

submitButton.addEventListener("click", function () {  
  if(wrapperThis.files.length){
        error = `Please select a file`; 
    } else {
        wrapperThis.processQueue(); 
    }
}); 

Ответ 6

Вы должны проверить, есть ли файлы в очереди. Если очередь пуста, вызовите непосредственно dropzone.uploadFile(). Этот метод требует, чтобы вы передавали файл. Как указано в [caniuse] [1], конструктор файлов не поддерживается в IE/Edge, поэтому просто используйте Blob API, поскольку на нем основан API файлов.

Метод formData.append(), используемый в dropzone.uploadFile(), требует, чтобы вы передавали объект, который реализует интерфейс Blob. Это причина, по которой вы не можете передать обычный объект.

dropzone version 5.2.0 требует опции upload.chunked

if (this.dropzone.getQueuedFiles().length === 0) {
    var blob = new Blob();
    blob.upload = { 'chunked': this.dropzone.defaultOptions.chunking };
    this.dropzone.uploadFile(blob);
} else {
    this.dropzone.processQueue();
}