ajax 完成后将值传递给 dropzone 发送选项

Question

所以我正在使用 dropzone，一切都可以正常上传，但现在我要将图像路径添加到数据库中。我遇到的问题是我首先想提交一个带有 ajax 的表单，在成功完成之后我想将数据库上新创建的 ID 传递到 dropzone 的发送选项中。一切都分开工作，但我不知道如何将新 ID 放入 dropzone 的发送选项中。这是我的 2 段相关代码。

Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#dropzonePreview", {

    url: "list/post-image",
    parallelUploads: 6,
    autoProcessQueue: false,
    processing: function(){
        this.options.autoProcessQueue = true;
    },
    sending: function(file, xhr, formData) {

        formData.append("_token", $('[name=_token]').val());
    }

});

这是 ajax 调用。我想我会尝试 myDropzone.options.sending，但我可以弄清楚如何像上面的代码一样附加 formData。

var form = $('form', wizard).serialize();
        $.ajax({
            type: "POST",
            url: 'list',
            data: form,
            success: function(data) {
                if (data.success)
                {
                    myDropzone.options.sending(null, null, formData)
                    {
                        formData.append("propertyID",         $('[name=propertyID]').val(data.propertyID));
                    }

                }
            }
        });

希望这只是我遗漏的一些小东西。提前感谢您的帮助。

Answer 1

我只是做了一些修补，然后 google 搜索了一下，我找到了答案。不使用发送选项，而是有一个 params 选项，它创建一个隐藏字段。这是我的 ajax 代码，它可以正常工作。

$.ajax({
            type: "POST",
            url: 'list',
            data: form,
            success: function(data) {
                if (data.success)
                {
                    myDropzone.options.params = {'propertyID': data.propertyID};
                }
                myDropzone.processQueue();
            }
        });

Answer 2

您必须将您的 dropzone 进程队列从 ajax 成功中移除：像这样： Dropzone.options.dropzoneJsForm = { 自动处理队列：假， acceptedFiles: ".png,.jpg,.gif,.bmp,.jpeg,.pdf,.rar,.zip", 最大文件大小：2，最大文件数：5， addRemoveLinks: true,

    init: function () {
        var submitButton = document.querySelector("#btnReg");
         myDropzone = this; //closure
         submitButton.addEventListener("click", function () {

             var coursenameID = $('#coursenameID').val();
             var coursetypecodeID = $('#courseTypeCodeID').val();
             var hdcourseexecuterID = $('#hdCourseExecuterID').val();
             //var coursecreationDateID = $('#courseCreationDateID').val();
             var selectedpersons = [];
             $("#doublerow input:checked").each(function () { selectedpersons.push($(this).val()) });

             $.ajax({
                 url: '@Url.Action("InsertToDB", "Course")',
                 type: "POST",
                 dataType: "json",
                 traditional: true,

                 data: { "coursenameID": coursenameID, "coursetypecodeID": coursetypecodeID, "hdcourseexecuterID": hdcourseexecuterID, "selectedpersons": selectedpersons },
                 beforeSend: function () {
                     $('#savingdata').addClass('show');
                 },
                 success: function (Response) {
                     console.log(Response);
                     if (Response > 0) {
                         courseid = Response;
                         console.log(Response);
                         $('#savingdata').addClass('hide');

                     }

                 }

             });
             myDropzone.options.params = { 'propertyID': courseid };
         myDropzone.processQueue();
        });

    }
};

ajax 完成后将值传递给 dropzone 发送选项

Pass value into dropzone sending option after ajax is complete

php

ajax

jquery

dropzone.js

laravel-5