Hey,
ich nutze https://www.dropzonejs.com/ um meine Datei Upload Felder etwas schöner und übersichtlicher zu gestalten, leider kann ich trotzt mehreren versuchen und stunden langem googlen keine möglichkeit finden die Datei Typen zu begrenzen, noch einen extra wert mit zu übergeben.
In der Dokumentation steht zwar drin wie es funktionieren sollte, was aber nicht klappt. beim googlen hab ich mehrere möglichkeiten gefunden aber auch keine davon funktioniert. Hochladen und anzeigen macht er alles Richtig, nur kann ich keine Optionen hinzufügen.
Es gibt auch noch eine Andere Art das ganze einzubinden aber dazu habe ich auch nichts gefunden.
Hier ist einmal mein Aktueller Code:
ich nutze https://www.dropzonejs.com/ um meine Datei Upload Felder etwas schöner und übersichtlicher zu gestalten, leider kann ich trotzt mehreren versuchen und stunden langem googlen keine möglichkeit finden die Datei Typen zu begrenzen, noch einen extra wert mit zu übergeben.
In der Dokumentation steht zwar drin wie es funktionieren sollte, was aber nicht klappt. beim googlen hab ich mehrere möglichkeiten gefunden aber auch keine davon funktioniert. Hochladen und anzeigen macht er alles Richtig, nur kann ich keine Optionen hinzufügen.
Es gibt auch noch eine Andere Art das ganze einzubinden aber dazu habe ich auch nichts gefunden.
Hier ist einmal mein Aktueller Code:
HTML-Code:
<div class="col-sm-6"> <div class="card"> <div class="card-header"> <h5 data-toggle="tooltip" data-html="true" title="" data-original-title="Erlaubte Formate<br/>[ .jpg | .jpeg | .png ]"><i class="feather icon-image"></i> Galerie Bilder</h5> </div> <div class="card-body"> <form id="image-upload" action="assets/plugins/fileupload/js/file-upload.php" class="dropzone"> <div class="fallback"> <input name="file" type="file" multiple /> </div> </form> <div class="row"> <div class="col-sm-6"> <div class="text-center m-t-20"> <select class="custom-select" name="folder" required> <option value="" selected disabled hidden>Bitte wählen</option> <option value="gallery">Gallerie</option> <option value="memory">Erinnerung</option> <option value="video">Video</option> </select> </div> </div> </div> </div> </div> </div> ... more code ... <!-- file-upload Js --> <script src="assets/plugins/fileupload/js/dropzone-amd-module.min.js"></script> <script type="text/javascript"> window.onload = function() { Dropzone.options.imageUpload = { paramName: "file", // The name that will be used to transfer the file maxFilesize: 2, // MB dictResponseError: 'Server not Configured', acceptedFiles: ".jpg", init:function(){ var self = this; // config self.options.addRemoveLinks = true; self.options.dictRemoveFile = "Delete"; //New file added self.on("addedfile", function (file) { console.log('new file added ', file); }); // Send file starts self.on("sending", function (file) { console.log('upload started', file); $('.meter').show(); }); // File upload Progress self.on("totaluploadprogress", function (progress) { console.log("progress ", progress); $('.roller').width(progress + '%'); }); self.on("queuecomplete", function (progress) { $('.meter').delay(999).slideUp(999); }); // On removing file self.on("removedfile", function (file) { console.log(file); }); } }; }; </script>
Kommentar