web-dev-qa-db-fra.com

dropzone télécharger un seul fichier

J'utilise dropzone.js pour ma solution de téléchargement de fichiers par glisser-déposer. Je souhaite télécharger un seul fichier, si je télécharge un deuxième fichier, le premier doit être supprimé et le second doit être téléchargé. une idée comment le faire ..

voici mon html

<form class="dropzone dz-clickable" action="upload.php" enctype='multipart/form-data'>
  <i class="fa fa-cloud-upload element"></i>
  <div style="color:gray;">Drag and drop or click to upload image</div>
  <input type="hidden" name="filenameEmail" class="filenameEmail" value="">
  <input type="hidden" name="side" value="front">
</form>

j'ai changé dropzone.js

maxFiles: 1

il permet de télécharger un seul fichier mais je ne peux pas supprimer le fichier précédemment téléchargé.Merci de m'aider.Merci à l'avance

27
user3064914

maxFiles: 1 est utilisé pour indiquer à dropzone qu'il ne doit y avoir qu'un seul fichier. Lorsqu'il y a plus d'un fichier, la fonction maxfilesexceeded sera appelée, avec le fichier excédentaire comme premier paramètre.

voici une fonction simple pour supprimer l'aperçu du premier fichier et ajouter le nouveau :)

maxFiles:1,
init: function() {
      this.on("maxfilesexceeded", function(file) {
            this.removeAllFiles();
            this.addFile(file);
      });
}   
77
NeoNe

J'ai utilisé l'événement maxfilesexceeded avec la méthode addFile et je suis passé à boucle infinie de l'appel d'événement. Ce devrait être le problème de l'utilisation de addFile parce que je ne l'ai pas vu mentionné sur le site officiel ou le wiki GitHub. Enfin, j'ai résolu avec l'événement addedfile. Le Dropzone.js est la dernière version lorsque j'écris (4.3.0).

init: function() {
  this.on('addedfile', function(file) {
    if (this.files.length > 1) {
      this.removeFile(this.files[0]);
    }
  });
}
16
darkbaby123

Limiter maxFiles à 1 permet toujours de sélectionner plusieurs fichiers dans la boîte de dialogue de téléchargement. Pour interdire la sélection de plusieurs images dans la configuration, spécifiez la fonction init suivante:

maxFiles:1,
init: function() {
    this.hiddenFileInput.removeAttribute('multiple');
}  
13
darklow
 Dropzone.prototype.defaultOptions.init = function () {

                 this.hiddenFileInput.removeAttribute('multiple');
                 this.on("maxfilesexceeded", function (file) {
                     this.removeAllFiles();
                     this.addFile(file);
                 });
             };

c'est du travail pour moi.