entfernen Sie Vorschauen von dropzone nach Erfolg
Ich will rollback der original-dropzone mit der Botschaft "Dateien hier ablegen" nach dem Erfolg der Veranstaltung der dropzone oder nach dem complete-Ereignis der dropzone.
Will ich nicht sehen, die Vorschau nach Erfolg oder abgeschlossen.
Dies ist mein dropzone Skript:
Dropzone.options.myAwesomeDropzone = {
paramName: "file", //The name that will be used to transfer the file
maxFilesize: 2, //MB
parallelUploads: 1,
success: function(file, response) {
var imageSrc = response;
$(".img-responsive").attr('src', imageSrc);
if (imageSrc == '/assets/images/offerfeatimg.jpg') {
$(".removebutton").hide();
} else {
$(".removebutton").show();
}
}
};
InformationsquelleAutor Adnan Mujkanovic | 2015-11-21
Du musst angemeldet sein, um einen Kommentar abzugeben.
müssen nur die call-Methode removeFile in der success Funktion
überprüfen doc dropzone
this.removeFile(file);
wird, entfernen Sie die Vorschau, aber es feuert auch die removedFile Veranstaltung, die bewirken, dass ein ajax-call an den server, die Datei zu löschen, wenn Sie Unterstützung für den Umgang mit diesen Ereignissen zu entfernen hochgeladenen Dateien. Es wäre schön, einen Weg zu haben, entfernen Sie die Miniaturansicht, ohne brennen aus einem removedFile Veranstaltung.InformationsquelleAutor Daniel Arenas
Nutzung @kkthxby3 's Idee, die innerHTML-für die Miniaturansichten gelöscht werden, kann in der Erfolgs-Methode mit dem folgenden code:
Die Schönheit dieses Ansatzes ist, dass es löscht das Vorschaubild, ohne brennen der
removedFile
Veranstaltung.Dies lässt auch den folgenden html-Code in den dom, wo die Vorschau war:
aber wie Sie sehen können, das div oben, die verantwortlich für die Anzeige der Miniaturansicht ist nun leer.
Anderen Ansatz zu entfernen, selbst den umschließenden div umschließt die Miniaturansicht zusammen mit seinem Inhalt. Dieser Ansatz kann erreicht werden mit dem folgenden code in die Methode Erfolg, und lässt keine Spur von der Miniaturansicht in die dom:
Genießen.
InformationsquelleAutor Ron C
Nur ein fyi...
Die Methode 'removeAllFiles' ist nicht unbedingt die erste Wahl. Das ist das gleiche wie " removeFile(file)'.
Habe ich einen event-handler für dropZone "removedfile' event... ich bin über Sie zu senden, um eine server-Meldung zum löschen der jeweiligen Datei von dem server (sollte ein user löschen der thumbnail-nachdem es hochgeladen wurde). Mit der Methode 'removeAllFiles' (sowie die individualisierte 'removeFile ("Datei")') feuert das Ereignis 'removedfile", die löscht die hochgeladenen Bilder zusätzlich zum löschen der thumbnails.
So könnte man hinzufügen, einige raffiniert, um dieses aber in der Realität ist die Methode nicht korrekt ist.
Suche durch die api für Dropzone ich bin nicht zu sehen, einen API-Aufruf, um einfach zurücksetzen oder löschen der thumbnails... Die Methode 'disable()' löschen der gespeicherten Dateinamen und was nicht, aber nicht klar den thumbnails... Scheint dropzoneJS ist eigentlich fehlt eine kritische API-Aufruf, um ehrlich zu sein.
Meine Arbeit um zu manuell zurücksetzen, enthält der div für dropzone:
Dokument.getElementById("divNameWhereDropzoneClassIs").innerHTML = ""
Diese löscht die thumbnails ohne brennen aus der Veranstaltung "removedfile", die verwendet werden soll, für das löschen eines Bildes von dem server...
InformationsquelleAutor kkthxby3
Ist die einfachste Sache ist zu nennen die dropzone
removeFile()
Methode, verwenden einen Ereignis-listener für den Erfolg der Veranstaltung.InformationsquelleAutor wallek876
Für mich der einfachste Weg, um das Datei-Vorschau nicht erscheinen, ist mit css.
dz-preview
unddz-file-preview
sind ein paar Klassen in der äußere div-Element der html-Vorschau generiert, von der Standard-Vorlage.Habe ich auch gesagt, dass Sie nicht erstellen Sie Miniaturansichten in der
Dropzone.options
.Die Vorlage noch generiert die html-Vorschau anzuzeigen wenn. Also in meinem "complete" - Funktion
dz_complete
ich es löschen alle.InformationsquelleAutor ourmandave
War ich mit
file.previewElement.remove()
, funktioniert in Chrome, aber nicht im IE funktioniert.Dann habe ich versucht
this.removeFile(file)
, aber es hat nicht funktioniert für mich.Nach, dass ich versuchte
file.previewElement.innerHTML = ""
was funktioniert in Chrome und IE, aber es hinterlässt einen extra-div, wo die Vorschau-Elemente waren.So funktioniert das für mich besser...
InformationsquelleAutor Giovanni Richaud
100% Getestet und Funktioniert:
InformationsquelleAutor user3820311