Dropzonejs auf WordPress mit Ajax Uploads, ich kann nicht Mockfile arbeiten

Question

Ich habe dropzonejs erfolgreich auf WordPress implementiert und ich habe alles funktioniert, bis der Teil ich Bilder in Dropzone laden muss, die bereits auf dem Server hochgeladen werden. Ich habe eine benutzerdefinierte Vorlage zum Erstellen neuer Posts und Bearbeiten von Posts im Frontend erstellt. Beim Erstellen von Posts funktioniert alles gut, da Dropzone nur neue Dateien hochlädt, aber beim Bearbeiten von Posts muss ich in Dropzone-Dateien ziehen, die bereits in den Post hochgeladen wurden.

Von allen Anweisungen da draußen konnte ich keine Lösung finden, die für mich arbeiten würde.

die komplette Skript mit einer Dropzone ist (das Skript direkt in Vorlage PHP ist so ein bisschen von PHP es innerhalb Javascript Mischen)

<script> 
jQuery(document).ready(function ($) { 
// Dropzone file uploader 
Dropzone.autoDiscover = false; 
var myDropzone = new Dropzone ("#media-uploader", { 
    url: dropParam.upload, 
    autoProcessQueue: true, 
    parallelUploads: 1, 
    uploadMultiple: false, 
    maxFilesize: 3, 
    acceptedFiles: 'image/*', 
    addRemoveLinks: true, 
    maxFiles: 10, 
    success: function (file, response) { 
     file.previewElement.classList.add("dz-success"); 
     file['attachment_id'] = response; // push the id for future reference 
     $('#uploaded-media').append($('<input type="hidden" name="media-ids[]" id="media-ids[]" class="media-ids" value="' + response +'">')); 
    }, 
    error: function (file, response) { 
     file.previewElement.classList.add("dz-error"); 
    }, 
    // update the following section is for removing image from library 
    removedfile: function(file) { 
     var attachment_id = file.attachment_id; 
     jQuery.ajax({ 
      type: 'POST', 
      url: dropParam.delete, 
      data: { 
       media_id : attachment_id 
      } 
     }); 
     $('input.media-ids[type=hidden]').each(function() { 
      if ($(this).val() === attachment_id) { 
       $(this).remove(); 
      } 
     }); 
     var _ref; 
     return (_ref = file.previewElement) != null ? _ref.parentNode.removeChild(file.previewElement) : void 0; 
    } 
}); 
<?php if ($media != '') { 
    for($i = 0; $i < count($media) ; $i++) { 
     $media_info[$i]['src'] = wp_get_attachment_image_src($media[$i]); 
     $media_info[$i]['size'] = filesize(get_attached_file($media[$i])); 
     $media_info[$i]['name'] = basename($media_info[$i]['src'][0]); 
    ?> 
     var mockFile = { name: "<?php echo $media_info[$i]['name'] ?>", size: <?php echo $media_info[$i]['size'] ?> }; 
     myDropzone.emit("addedfile", mockFile); 
     myDropzone.emit("thumbnail", mockFile, "<?php echo $media_info[$i]['src'][0] ?>"); 
     myDropzone.emit("complete", mockFile); 
    <?php } ?> 
    var existingFileCount = <?php echo $i ?>; // The number of files already uploaded 
    myDropzone.options.maxFiles = myDropzone.options.maxFiles - existingFileCount; 
<?php } ?> 

}); 
</script> 

So dies tatsächlich die Bilder vom Server erhalten, erhalten die Info der Bilder und setze sie in das Dropzone-Feld.

Das Problem ist, wenn ich versuche, das Bild aus der Dropzone zu entfernen, reagiert das Skript nicht auf AJAX Remove-Funktion Ich sehe keine Antwort in meiner Firebug-Konsole. Eigentlich hört die Dropzone auf weitere Aktionen zu reagieren (zu entfernen oder ein neues Bild hinzufügen)

EDIT: denke ich, was ich bin eigentlich fehlt file['attachment_id'] = response; // push the id for future reference Teil ist, wenn mockfile zu schaffen.

Answer 1

Also ich habe es funktioniert, nach 2 Tagen auf der Suche nach Lösung habe ich es nur kurz nachdem ich hier für eine Frage veröffentlicht. Es passiert immer so.

Um es zum Laufen zu bringen, musste ich 2 Dinge ändern. Zuerst hinzugefügt i attachment_id zu vorinstallierten Bilder

var mockFile = { name: "<?php echo $media_info[$i]['name'] ?>", size: <?php echo $media_info[$i]['size'] ?>, attachment_id: <?php echo $media[$i] ?> }; 

Und zweitens scheint es, dass diese attachment_id von vorinstallierten Bildern ein String ist so bei der Suche nach Eingabefeld gelöscht werden ich es ändern musste für den gleichen Wert statt identischen Wert zu überprüfen .

$('input.media-ids[type=hidden]').each(function() { 
     if ($(this).val() == attachment_id) { 
      $(this).remove(); 
     } 
    });