Dropzone Processing Queue not working on server side validation

Question

I am using Laravel 5.8 and integrated dropzone in form.In my form i have post title unique validation on server side.

Scenario of problem is

1.user will enter blog post title and add 5 images in dropzone.

2.then if the entered title already exist then it will validation error

3.after the validation error again if we try to submit form then request will not sent to server.It means dzClosure.processQueue(); fails

document.getElementById("submitArticleFormButton").addEventListener("click", function(e) {
 if (dzClosure.files.length>0) {
                        ;

                        dzClosure.processQueue(); 
                    } else {

                        dzClosure.uploadFiles([]);


                    }
}

How i can fix this issue.

When i refereed some of the issues i found following document https://github.com/enyo/dropzone/wiki/FAQ#how-to-show-an-error-returned-by-the-server

even i my case when validation error thrown then it will be 419 but still not working as expected

Updates I have issue only if server side validation other than that it works fine.even after validation thrown if i add extra image then if i try to submit then it will work fine. Even i have included csrf token and 419 its custom header set

  public function respond($data, $headers = [])
    {
        $data['error']="error occured";
        return response()->json($data,419, $headers);
    }

Answer 1

Have you attached your CSRF token to the dropzone header? I had the same issue a while ago and was able to fix it by using CSRF token header with Dropzone.

First, you would need to print our CSRF token

   var CSRF_token = {% csrf_token %};

Then include it with your request.

   sending: function(file, xhr, formData) {
      formData.append("csrf_token", CSRF_token);
   }

---

Updated answer,

Try manually updating Dropzone file status to Queued so dropzone would upload the same image again.

dzClosure.files.forEach(file => {
   file.status = Dropzone.QUEUED
})