Dropzone Display existing files and edit already existing images

I am using Dropzone js to upload images to my application. This works fine on the insert page but I need to be able to edit records and add or change already existing images associated with the record. The overall application is using Laravel.

I used the following code to do this, the files are added, but when I click on the submit button, it says that there is no file.

 myDropzone.emit("addedfile", mockFile);
 myDropzone.emit("thumbnail", mockFile, path);
 myDropzone.emit("complete", mockFile);
 myDropzone.files.push(mockFile); // added this line

My dropzone options :

            var options = {
            autoProcessQueue: false,
            maxFilesize: 5, // MB
            dictRemoveFile: "Remove",
            addRemoveLinks: true,
            paramName: "files",
            maxFiles: 6,
            parallelUploads: 6,
            uploadMultiple: true,
            acceptedFiles:"image/jpeg,image/jpg,image/png",
            capture: "image/*",
            previewsContainer: ".dropzone-previews",
            clickable:'.dropzone-previews',
            thumbnailMethod: 'crop',
            timeout: 500000,
            myAwesomeDropzone : true,
            autoDiscover :false,
            init: DropzoneInitializeFunction,
            ignoreHiddenFiles:true,
        };

How would I do this?

Answer :

I found the answers to my questions myself and i will put it below for you too.

This code is written for Laravel blade file :

    @foreach ($product->attachments as $attach)
    <?php $path =  Helper::image_to_base64(asset($attach->url)); ?>

    <script>
        $("document").ready(()=>{
            var path = "{{ $path }}";
            var file = new File([path], "{{ $attach->file_name }}", {type: "{{ $attach->mime_type }}", lastModified: {{ $attach->updated_at}}})
            file['status'] = "queued";
            file['status'] = "queued";
            file['previewElement'] = "div.dz-preview.dz-image-preview";
            file['previewTemplate'] = "div.dz-preview.dz-image-preview";
            file['_removeLink'] = "a.dz-remove";
            file['webkitRelativePath'] = "";
            file['width'] = 500;
            file['height'] = 500;
            file['accepted'] = true;
            file['dataURL'] = path;
            file['upload'] = {
                bytesSent: 0 ,
                filename: "{{ $attach->file_name }}" ,
                progress: 0 ,
                total: {{ $attach->file_size }} ,
                uuid: "{{ md5($attach->id) }}" ,
            };

            myDropzone.emit("addedfile", file , path);
            myDropzone.emit("thumbnail", file , path);
            // myDropzone.emit("complete", itemInfo);
            // myDropzone.options.maxFiles = myDropzone.options.maxFiles - 1;
            myDropzone.files.push(file);
            console.log(file);
        });
    </script>
@endforeach