Witajcie.

Mam 2 funkcje:


$(document).ready(function(){
        function getFilesToArray(){

        $.ajax({
            url: 'http://localhost/dropZoneUpload.php?parm=1',
            type: 'get',
            dataType: 'json',
            success: function(response){
                return response;


            }
        })
        }

    })



    Dropzone.options.dpzMultipleFiles = {
        // Prevents Dropzone from uploading dropped files immediately
        uploadMultiple: true,
        paramName: "file",
        maxFilesize: 100,
        maxFiles: 2,
        createImageThumbnails: true,
        acceptedFiles: ".png,.jpg,.jpeg",
        clickable: true,
        thumbnailWidth: 150,
        thumbnailHeight: 150,
        autoProcessQueue: false,

        init: function () {
            var submitButton = document.querySelector("#submit-all")
            dpzMultipleFiles = this;
            submitButton.addEventListener("click", function () {
                dpzMultipleFiles.processQueue();
            });
            this.on('completemultiple', function (file, json) {
                $('.sortable').sortable('enable');
            });
            this.on('success', function (file, json) {
                let val = file.accepted;
                if (file.accepted == true) {
                    //alert ('JSON - wgrałem!');
                    console.log(json);
                    $('.main_form').append("<input type='text' name='imgFiles[]' value='" + file.name + "'/>");
                }
                let val1 = file.name;
            });
            this.on("addedfile", function (file) {
                var removeButton = Dropzone.createElement("<button> Remove file </button>");
                // Capture the Dropzone instance as closure.
                var _this = this;

                //console.log(file);
                removeButton.addEventListener("click", function (e) {
                    // Make sure the button click doesn't submit the form:
                    e.preventDefault();
                    e.stopPropagation();

                    // Remove the file preview.
                    _this.removeFile(file);
                    // If you want to the delete the file on the server as well,
                    // you can do the AJAX request here.
                    console.log("kasuje" + file.name);
                    console.log(file);
                });
                file.previewElement.appendChild(removeButton);
            });
            this.on('drop', function (file) {
                console.log('File', file);
                alert('bb');
            });
            this.on("maxfilesexceeded", function (file) {
                this.removeFile(file);
            });
        }
    };
    $(function () {
        $(".dropzone").sortable({
            items: '.dz-preview',
            cursor: 'move',
            opacity: 0.5,
            containment: '.dropzone',
            distance: 20,
            tolerance: 'pointer'
        });
    });

Chciałbym użyć funkcji getFilesToArray do wprowadzenia plików do Dropzone.options.dpzMultipleFiles.

Znalazłem działający przykład:


$(".dropzone").dropzone({
  init: function() { 
    myDropzone = this;
    $.ajax({
      url: 'upload.php',
      type: 'post',
      data: {request: 2},
      dataType: 'json',
      success: function(response){

        $.each(response, function(key,value) {
          var mockFile = { name: value.name, size: value.size };

          myDropzone.emit("addedfile", mockFile);
          myDropzone.emit("thumbnail", mockFile, value.path);
          myDropzone.emit("complete", mockFile);

        });

      }
    });
  }
});

tylko nie wiem jak połączyć ten mój kod z kodem Dropzone (tak żeby działał jak przykład powyżej)

Gdyby to było istotne, to mój PHP generuje takie wyniki:

[{"Name": "q1.jpg", "size": 433382, "path", ".. \ / assets \ / uploads \ /q1.jpg"}, {"name": "bla.jpg" "size": 193540, "path", ".. \ / assets \ / uploads \ /bla.jpg"}]

Wie ktoś może jak to zrobić?