Contao: zwei Multi File Uploader fürs Formular
Datei Upload im Web wird spätestens dann zur Herausforderung, wenn mehr als eine Datei übermittelt werden soll.
Das Standard-Konstrukt des Contao Formulars, der Datei-Upload, ist nur für eine einzige Datei konzipiert und mehrere dieser Elemente innerhalb eines Formulars können schnell zu Usability Problemen führen.
In diesem Fall bieten sich zwei (derzeit verfügbare) Contao Erweiterungen an, die das Formular um die Möglichkeit zum Mehrfach-Upload erweitern. FancyUpload und der valumsFileUploader. Beide lassen sich im Backend und im Frontend einsetzen.
Stand dieses Beitrags:
Contao 2.9.4 zum 29.04.2011,
Fancy Upload 2.0.0 rc1
valumsFileUploader 2.0.0 beta1
FancyUpload
Fancy Upload kommt sicher jedem, der mit Contao arbeitet, bekannt vor. In den persönlichen Einstellungen des Administrationsbereichs kann man dieses Plugin aktivieren und erhält dann eine wirklich komfortable Möglichkeit zum Datei Upload inkl. Fortschrittsanzeige.
Andreas Schempp hat eine geschrieben, mit der FancyUpload auch in Formularen des Frontends eingesetzt werden kann. - das Erscheinungsbild im Frontend ist übrigens standardmäßig ähnlich wie die des Backends. Im Frontend werden Dateien mit dem Absenden des Formulars übertragen.
Die Funktionweise ist, wie man sich das so wünscht:
- man kann nacheinander Dateien auswählen und hat immer eine Übersicht über die gewählten Dateien
- man kann vor dem eigentlichen Upload (doch) nicht benötigte Dateien wieder entfernen
- man kann jederzeit abschätzen, wie lange der Upload noch dauern wird
Das Ganze erfüllt damit einige wichtige Aspekte der Benutzerfreundlichkeit:
- Übersichtlichkeit
- Planbarkeit
- Kontrolle
- Undo
Das Unschöne: der FancyUpload funktioniert mit Flash. Und Flash wird einfach immer mehr zum No-Go und ist daher für viele Kunden und User nicht akzeptabel.
Das ist für mich als Contao Dienstleisterin natürlich insofern tragisch, weil FancyUpload genauso arbeitet wie es soll und nochdazu verständlich und benutzerfreundlich rüberkommt.
valumsFileUploader
Es ist daher nur konsequent, dass sich jemand mit der non-Flash Variante auseinandergesetzt hat. Die kommt aus dem Hause Men-At-Work und heißt . Es baut voll auf AJAX und kann ebenso im Backend unter “Persönliche Daten” aktiviert als auch in Frontend Formularen eingesetzt werden.
So präsentiert sich der valumsFileUploader im Backend:
Eine kleine Kritik muss ich hier anbringen. Einem ungeübten User ist bei diesem Bild wahrscheinlich nicht klar, dass Klick auf die grüne Fläche den Durchsuchen-Dialog des Betriebssystems startet. Das Drag & Drop Prinzip könnte man wahrscheinlich ganz gut auch über ein entsprechendes Icon anzeigen.
Problem: Mit dem Drag & Drop oder der Auswahl einer oder meherer Dateien beginnt sofort der Upload.
Dieser Upload kann vom User zwar unterbrochen werden, ist die Datei aber mal “drüben”, so ist sie da und kann über den Uploader (!) nicht mehr entfernt werden. Es gibt also einen Abbruch, aber keinen Papierkorb.
Was im Backend kein wirkliches Problem darstellt, ist in Formularen durchaus eines. Vielleicht wollte der Nutzer ja eine andere Datei wählen und hat versehentlich eine falsche erwischt? Wie teile ich sowas dem Empfänger der Formulardaten mit?
Dabei passiert zunächst folgendes: die Dateien werden in /system/tmp abgelegt und erst mit der Übermittlung des Formulars an ihrem eigentlichen Zielort. Technisch also kein Problem, nur die Basis, der valums Ajax-Uploader sieht genau das nicht vor.
Die Funktionweise ist also nur bedingt, wie man sich das so wünscht:
- man kann in einem Schwung oder nacheinander Dateien auswählen
- der Uploader unterstützt bequemes Drag & Drop
- der Upload startet für jede Datei sofort
- die Upload Anzeige wird angezeigt
- der Upload kann abgebrochen werden
- man kann jederzeit abschätzen, wie lange der Upload noch dauern wird
Hinsichtlich der Benutzerfreundlichkeit sieht das für mich so aus:
- Komfort
- Kontrolle während laufender Uploads
- Übersicht über laufende und erfolgte Uploads
- kein Undo nach erfolgtem Upload (was ja bei kleinen Dateien recht schnell gehen kann)
Nachteil damit für mich ganz klar: die Erweiterung wäre super, wäre da nicht das kleine Manko, dass es nicht möglich ist, bereits hochgeladene Dateien wieder zu entfernen. Eine Sache, die ich vor allem im Frontend eklatant wichtig finde.
Was nun?
Beide Erweiterungen machen einen guten Job und bieten mit dem Multi Upload eine komfortable Variante, mehrere Einzel-Upload Felder im Formular zu umgehen.
Ob man sich nun für Flash und damit für die volle Kontrolle durch den User entscheidet oder ob man auf Flash verzichten möchte bzw. muss, hängt natürlich von den Gegebenheiten des Projekts ab.
Ich bin weder eine Flash-Coderin noch eine AJAX Spezialistin.
Die Probleme und Fragen zeigen mir jedoch, dass es sinnvoll ist, Aspekte wie diese vorab mit dem Kunden zu besprechen. Oder: sich selbst ans Coden zu machen und seine eigene Erweiterung zu schreiben ;-) Macht ja auch alles irgendwie Lust auf HTML5, oder nicht?
Übrigens werde ich ab sofort zu jedem Contao Beitrag die aktuelle Version schreiben. Ich habe leider nicht die Zeit, alte Beiträge wirklich zeitnah zu überprüfen und zu aktualisieren. Jeder, der also einen meiner Beiträge liest, weiß damit unter Umständen auch, dass der vielleicht schon veraltet ist.
Und wenn der Beitrag wirklich inzwischen gar nicht mehr aktuell sein sollte, weil sich glücklicherweise eine bessere Lösung oder Alternative aufgetan hat, freue ich mich über entsprechende Hinweise in den Kommentaren.
