在 dropzone.js 中分配文件服務器 ID

Question

使用dropzone.js我正在為我的滑塊上傳圖片。 當我將文件上傳到服務器時，響應只是一個與圖像/文件數據庫 ID 對應的數字。 如果有文件列表，則有一個 id 列表作為響應。 現在我想出於某種目的將此 ID 分配給 dropzone 文件。

Answer 1

上傳文件時會觸發成功事件，附加到該事件，示例代碼如下（ this是 dropzone 參考）

this.on("success",
    function(file, responseStr) {
        console.log(responseStr);
        var responseObj = JSON.parse(responseStr);
        if (responseObj.success) {
            // save response for later processing
            file.additionalInfo = responseObj;
        } else {
            var message = responseObj.message;
            file.previewElement.classList.add("dz-error");
            file.status = Dropzone.ERROR;
            var els = file.previewElement.querySelectorAll("[data-dz-errormessage]");
            for (var i = 0; i < els.length; i++) {
                els[i].textContent = message;
            }
        }
});

Answer 2

對於多個文件，您可以使用 dropzone 提供的“multilefiles”事件，或者只是遍歷每個文件的響應，如下所示：

                           this.on("success", function (file, response)
                            {
                                // if multiple files are saved the response returns all the documents
                                // but dropzone will fire the success event per file
                                // find the corresponding document based on name
                                if (response != null && response.Documents != null)
                                {
                                    var d = response.Documents.find(x => x.FileName ==  file.name);
                                    refresh = true;
                                    dropZone.emit("thumbnail", file, d.ThumbnailBase64);
                                }

                            });

Answer 3

成功設置預覽“id”屬性

myDropzone.on("success", function(file,data) {
    let myfile = file.previewTemplate;
    myfile.setAttribute('id',data.server_data.id);
});

在刪除操作中獲取此 ID

myDropzone.on("removedfile", function(file) {

    var server_file = $(file.previewTemplate);
    var id = server_file.attr("id");
    $.ajax({
        url: your url,
        type: "DELETE",
        data: { "_token":_token,'id':id },
        success: (data) => {
        console.log(data);
        },
        error: function(data){
        console.log(data);
        }
    });
});