У меня есть форма, где я использую dropzone.js для загрузки файла. Теперь я проверяю все поля ввода. Но я не могу проверить файл перед отправкой. Если файл загружен, то отправка должна работать. В противном случае должно появиться сообщение об ошибке типа «пожалуйста, загрузите файл». Как я могу достичь этого?

HTML код:

{amp}lt;form action="/action"{amp}gt; {amp}lt;div class="form-row"{amp}gt; {amp}lt;div class="form-group col-md-6"{amp}gt; {amp}lt;input type="text" class="form-control" id="first_name" name="first_name" placeholder="First Name" required{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="form-group col-md-6"{amp}gt; {amp}lt;input type="text" class="form-control" id="last_name" name="last_name" placeholder="Last Name" required{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="form-row"{amp}gt; {amp}lt;div class="form-group col-md-12"{amp}gt; {amp}lt;textarea class="form-control" id="message" name="message" placeholder="Message"{amp}gt;{amp}lt;/textarea{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="form-row"{amp}gt; {amp}lt;div id="resume" class="dropzone form-control"{amp}gt;{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;input type="submit" class="btn btn-primary mt-10" id="item-submit" value="submit"{amp}gt; {amp}lt;/form{amp}gt; 

Javascript:

 {amp}lt;script type="text/javascript"{amp}gt; $(document).ready(function () { $("div#resume").dropzone({ url: "/change-this-later" }); var dropzone3; Dropzone.autoDiscover = false; dropzone3 = new Dropzone('#resume', { maxFiles: 1, }); $('#item-submit').click(function(e) { e.preventDefault(); e.stopPropagation(); if ($('form#resume').valid()) {}; }); }); {amp}lt;/script{amp}gt; 

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

 //indicates file upload is complete and is successful var uploaded = false; $("div#resume").dropzone({ url: "/change-this-later", success: function (file, response) { uploaded = true; } }); //Check the value of 'uploaded' when validating rest of fields 

Итак, я обхожу это. Поскольку я отправляю все свои изображения и поля в одну и ту же кнопку, я просто присоединился к массиву файлов в боковой зоне и подтвердил, что его длина не равна 0. $ animalImage — моя прямая зона.

 var validateImages = function (animal) { if ($animalImage.files.length == 0) { swal({ title: 'Advertencia', type: 'info', html: "Debe de guardar al menos una imágen", showCloseButton: true, focusConfirm: false }); return false; } return animal; }; 

Надеюсь, это поможет, обратите внимание на отправку через ajax, поэтому я просто использовал dropzone для удобства пользователей.