"Durchsuchen..." -> getätigte Auswahl wieder loswerden
Meinereiner
"Durchsuchen..." -> getätigte Auswahl wieder loswerden
Meinereiner
Camping_RIDER
Matthias Apsel
Der Martin
Tobias HahnerHallo zusammen,
ich habe ein längeres Formular, in dem man diverse Eingabefelder hat. Unter anderem auch ein Input vom Typ "file". Dort kann man per "Durchsuchen"-Button eine lokale Datei auswählen.
Angenommen, man hat dort versehentlich etwas ausgewählt. Wie wird man das wieder los? Das Formular hat zwar einen Reset-Button, aber dann gehen auch alle anderen Eingaben des Formulares verloren.
Man kann auch eine andere Datei wählen, aber was kann man tun, wenn man GAR KEINE Datei ausgewählt haben will?
Im Firefox finde ich keine Lösung, im Internet Explorer auch nicht. Wenn ich die getroffene Auswahl anklicke öffnet sich nur wieder der Dateimanager, in dem die Datei ausgewählt ist. Ich kann zwar eine neue Datei wählen, aber "GAR KEINE" geht irgendwie nicht. Auch, wenn ich die Auswahl aus dem Dateifeld lösche, bleibt dann der Dateimanager offen. "Abbrechen" führt dazu, dass die Auswahl bestehen bleibt...
Auch per Google finde ich nichts dazu (ggf. verwende ich auch die falschen Suchbegriffe). Kann doch nicht sein, dass sowas einfaches noch nie irgendwo vorkam?!?
Gruß,
Meinereiner
-
Man kann auch eine andere Datei wählen, aber was kann man tun, wenn man GAR KEINE Datei ausgewählt haben will?
Mir ist keine native Methode für einen Reset bekannt und eine Maniuplation des Values via JavaScript ja aus guten Gründen verboten. Ich hatte den Bedarf noch nicht, folgendes sollte aber tun: Das Originalfeld aus dem DOM entfernen and stattedessen ein frisches einsetzen.
-
Aloha ;)
ich habe ein längeres Formular, in dem man diverse Eingabefelder hat. Unter anderem auch ein Input vom Typ "file". Dort kann man per "Durchsuchen"-Button eine lokale Datei auswählen.
Angenommen, man hat dort versehentlich etwas ausgewählt. Wie wird man das wieder los? Das Formular hat zwar einen Reset-Button, aber dann gehen auch alle anderen Eingaben des Formulares verloren.
Man kann auch eine andere Datei wählen, aber was kann man tun, wenn man GAR KEINE Datei ausgewählt haben will?
Humm-Homm. Wenn es keine andere Lösung gibt: Javascript.
Ich sehe zwei Möglichkeiten. Die erste funktioniert eventuell, die zweite sicher.
1.: Die Eigenschaft .value des Inputs zurücksetzen (also auf false oder null, oder falls möglich per Schlüsselwort delete - oder bei Onload den value zwischenspeichern und nachher wieder einsetzen).
2.: Das input type=file per Javascript aus dem Dom entfernen und per JS ein neues mit selber id, name, ... des Alten an diese Stelle setzen
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
Aloha ;)
Der Parallelpost von Mitleser hat soeben Methode 1 erledigt und Methode 2 gestützt ;)
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
Lieber Camping_RIDER,
Der Parallelpost von Mitleser hat soeben Methode 1 erledigt und Methode 2 gestützt ;)
aus aktuellem Anlass finde ich die dritte Methode noch besser, da kann man dann bereits getroffene Auswahlen wieder entfernen.
Liebe Grüße,
Felix Riesterer.
--
"Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)-
Aloha ;)
Stimmt, das ist wohl das Optimum ;)
Hehe, Felix, dir gehts glaub mit Plupload genauso wie mir mit dem Checkbox-Hack... Wir predigen, aber niemand wills hören :D :D
Wobei die Lösung für das native input-file-Element zumindest akademisch ja interessant ist ;)
Und manchmal WILL man ja auch nur eine einzige Datei hochladen lassen, da ist das Widget etwas groß für und suggeriert halt, dass mehrere Dateien hochgeladen werden können / sollen. Oder gibts das auch als Single-File-Variante? Dann wärs nämlich tatsächlich ne Verbesserung ohne Nachteile (zumindest keine, die mir einfallen). Die Core-API gefällt mir da platztechnisch schon ganz gut, nur kann man da halt wieder nicht entfernen bzw. auch immer noch mehr als eine Datei hochladen.
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
Lieber Camping_RIDER,
Hehe, Felix, dir gehts glaub mit Plupload genauso wie mir mit dem Checkbox-Hack... Wir predigen, aber niemand wills hören :D :D
erm... muss zugeben, dass ich das nicht mitbekommen habe. Welchen Hack meintest Du genau?
Wobei die Lösung für das native input-file-Element zumindest akademisch ja interessant ist ;)
Insbesondere der chunked transfer mode ist spitze! Damit kannst Du das post_max_size Limit in PHP kassieren und große Dateien stückweise hochladen - mit Fortschrittsanzeige!
Und manchmal WILL man ja auch nur eine einzige Datei hochladen lassen, da ist das Widget etwas groß für und suggeriert halt, dass mehrere Dateien hochgeladen werden können / sollen.
Aus Sicht des Backend wird immer nur eine Datei auf einmal hochgeladen. Warum sollte man hier eine Beschränkung wollen? Nur weil man das $_FILES-Array nicht auf mehrere Dateien auf einmal untersuchen will? Das hast Du mit Plupload nicht mehr. Und das ist sehr schön!
Die Core-API gefällt mir da platztechnisch schon ganz gut, nur kann man da halt wieder nicht entfernen bzw. auch immer noch mehr als eine Datei hochladen.
Du kannst jedem Eintrag in der Liste ein HTML-Element ankleben und ihm einen click-Eventhandler verpassen, der es wieder aus der Liste der hochzuladenden Dateien entfernt. Das ist mit dem fertigen Widget natürlich viel bequemer, aber mit der Core-API nicht unmöglich.
Liebe Grüße,
Felix Riesterer.
--
"Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)-
Aloha ;)
Hehe, Felix, dir gehts glaub mit Plupload genauso wie mir mit dem Checkbox-Hack... Wir predigen, aber niemand wills hören :D :D
erm... muss zugeben, dass ich das nicht mitbekommen habe. Welchen Hack meintest Du genau?
Nicht weiter wichtig ;) Das ist nur in letzter Zeit fast meine Standard-Antwort auf alle navigationsbezogenen Fragen. Sowie plupload deine Standardantwort auf File-Upload-Fragen ist ;)
Und manchmal WILL man ja auch nur eine einzige Datei hochladen lassen, da ist das Widget etwas groß für und suggeriert halt, dass mehrere Dateien hochgeladen werden können / sollen.
Aus Sicht des Backend wird immer nur eine Datei auf einmal hochgeladen. Warum sollte man hier eine Beschränkung wollen? Nur weil man das $_FILES-Array nicht auf mehrere Dateien auf einmal untersuchen will? Das hast Du mit Plupload nicht mehr. Und das ist sehr schön!
Folgender Usecase: Beim Anlegen eines Benutzerprofils soll A sich ein Profilbild hochladen können. Dabei soll der file-upload ganz genau eine Datei akzeptieren und (so wie der native Button) bei erneuter Auswahl das Alte verwerfen.
Allgemein gesprochen all das, wo dem User nur der Upload genau einer Datei erlaubt werden soll.
Die Funktionalität (eins hochladen und das alte damit überschreiben) müsste man wahrscheinlich über das Backend regeln und im Frontend muss man sich dann wahrscheinlich selber was zusammenbauen.
Summa summarum: Vielleicht doch ein wenig viel Aufwand für einfache Probleme (wie hier)? Weil Lösung zu allgemein und damit overpowered? Natürlich hat man mit plupload dafür auch Möglichkeiten, die man sonst nie bekommt!
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[-
Lieber Camping_RIDER,
hey, des is goil! *bookmark*
Das ist nur in letzter Zeit fast meine Standard-Antwort auf alle navigationsbezogenen Fragen.
Willst Du ernsthaft damit sagen, dass Du Navigationen mit Checkboxen umsetzen willst...? Oder habe ich das nur falsch verstanden?
Die Funktionalität (eins hochladen und das alte damit überschreiben) müsste man wahrscheinlich über das Backend regeln und im Frontend muss man sich dann wahrscheinlich selber was zusammenbauen.
Nö. Beim Upload kannst Du im Backend der Datei einen festen Namen geben, wenn Du sie bewegst. Damit ist das Überschreiben automatisch geregelt. Du hast nur den wirklichen Vorteil, dass die endgültige Dateigröße durch das Chunking nicht mehr von PHP beschränkt wird.
Clientseitig... och, mit der Core API kann man die Sache mit dem Auflisten der ausgewählten Dateien auch anders gestalten, ohne sich viel zu vergeben. Man kann den Eventhandler das vorhandene <li>-Element durch ein neues ersetzen lassen, anstatt es in der Liste anzufügen. Ebenso kann man bei diesem Event veranlassen, dass alle anderen Files entfernt werden und der Upload eben nur das zuletzt gewählte betrifft.
Summa summarum: Vielleicht doch ein wenig viel Aufwand für einfache Probleme (wie hier)? Weil Lösung zu allgemein und damit overpowered? Natürlich hat man mit plupload dafür auch Möglichkeiten, die man sonst nie bekommt!
Alles eine Frage der geschickten Nutzung der API. Und das ist nicht wirklich aufwendig!
Liebe Grüße,
Felix Riesterer.
--
"Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)-
Aloha ;)
hey, des is goil! *bookmark*
Sag ich doch :D
Das ist nur in letzter Zeit fast meine Standard-Antwort auf alle navigationsbezogenen Fragen.
Willst Du ernsthaft damit sagen, dass Du Navigationen mit Checkboxen umsetzen willst...? Oder habe ich das nur falsch verstanden?
Das will ich nicht nur, das tu ich sogar.
Die Funktionalität (eins hochladen und das alte damit überschreiben) müsste man wahrscheinlich über das Backend regeln und im Frontend muss man sich dann wahrscheinlich selber was zusammenbauen.
Nö. Beim Upload kannst Du im Backend der Datei einen festen Namen geben, wenn Du sie bewegst. Damit ist das Überschreiben automatisch geregelt. Du hast nur den wirklichen Vorteil, dass die endgültige Dateigröße durch das Chunking nicht mehr von PHP beschränkt wird.
Okay - stimmt soweit.
Clientseitig... och, mit der Core API kann man die Sache mit dem Auflisten der ausgewählten Dateien auch anders gestalten, ohne sich viel zu vergeben. Man kann den Eventhandler das vorhandene <li>-Element durch ein neues ersetzen lassen, anstatt es in der Liste anzufügen. Ebenso kann man bei diesem Event veranlassen, dass alle anderen Files entfernt werden und der Upload eben nur das zuletzt gewählte betrifft.
Alles eine Frage der geschickten Nutzung der API. Und das ist nicht wirklich aufwendig!
Okay - ich bin überzeugt ;)
plupload wird in Zukunft was Dateiformulare angeht meine persönliche eierlegende Wollmilchsau.
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
-
-
-
-
-
-
-
Om nah hoo pez nyeetz, Meinereiner!
ich habe ein längeres Formular, in dem man diverse Eingabefelder hat. Unter anderem auch ein Input vom Typ "file". Dort kann man per "Durchsuchen"-Button eine lokale Datei auswählen.
Angenommen, man hat dort versehentlich etwas ausgewählt. Wie wird man das wieder los? Das Formular hat zwar einen Reset-Button, aber dann gehen auch alle anderen Eingaben des Formulares verloren.
Man kann auch eine andere Datei wählen, aber was kann man tun, wenn man GAR KEINE Datei ausgewählt haben will?
Fragst du als Ersteller oder als Nutzer des Formulars?
Für den ersten Fall http://css-tricks.com/snippets/jquery/clear-a-file-input/ (Kommentare beachten)
Matthias
-
Hallo,
ich habe ein längeres Formular, in dem man diverse Eingabefelder hat. Unter anderem auch ein Input vom Typ "file". Dort kann man per "Durchsuchen"-Button eine lokale Datei auswählen.
Angenommen, man hat dort versehentlich etwas ausgewählt. Wie wird man das wieder los? Das Formular hat zwar einen Reset-Button, aber dann gehen auch alle anderen Eingaben des Formulares verloren.auch ich bin mir nicht ganz sicher, ob du aus der Sicht des Formular-Erstellers fragst, der seinen Nutzern einfach etwas mehr Komfort bieten möchte, oder aus der Sicht des ratlosen Nutzers.
Man kann auch eine andere Datei wählen, aber was kann man tun, wenn man GAR KEINE Datei ausgewählt haben will?
Als Nutzer: Indem man einfach den im Eingabfeld eingetragenen Dateinamen wieder löscht.
So long,
Martin--
F: Was sagt die kleine Kerze zur großen Kerze?
A: Ich gehe heute nacht aus!
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(-
Om nah hoo pez nyeetz, Der Martin!
Als Nutzer: Indem man einfach den im Eingabfeld eingetragenen Dateinamen wieder löscht.
Ähm - nö? http://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:HTML_input-Element10.html
Matthias
-
Hallo,
Als Nutzer: Indem man einfach den im Eingabfeld eingetragenen Dateinamen wieder löscht.
Ähm - nö? http://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:HTML_input-Element10.htmloops ... ich habe wohl sehr lange kein Dateiupload-Feld mehr benutzt. Ich kannte das von früher so, dass man das Textfeld als Teil des Upload-Controls wie ein ganz normales Textfeld verwenden und editieren kann, dass man sogar von Hand den Dateipfad reinschreiben konnte, wenn man das denn unbedingt wollte.
Jetzt stelle ich fest, dass eben dieses Textfeld im Opera Classic offenbar readonly ist, und im Firefox* tut sich bei deinem Beispiel nicht einmal beim Klicken auf den Browse-Button etwas. Gar nichts.
Ciao,
Martin* Ich sitz gerade an einer Büchse mit einer betagten Installation, da gibt's nichts Neueres als Firefox 20.
--
Das einzige Problem beim Nichtstun: Man weiß nie, wann man damit fertig ist.
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(-
Om nah hoo pez nyeetz, Der Martin!
und im Firefox* tut sich bei deinem Beispiel nicht einmal beim Klicken auf den Browse-Button etwas. Gar nichts.
* Ich sitz gerade an einer Büchse mit einer betagten Installation, da gibt's nichts Neueres als Firefox 20.
und hier? http://de.selfhtml.org/html/formulare/datei_upload.htm
Matthias
-
n'Abend!
und im Firefox* tut sich bei deinem Beispiel nicht einmal beim Klicken auf den Browse-Button etwas. Gar nichts.
* Ich sitz gerade an einer Büchse mit einer betagten Installation, da gibt's nichts Neueres als Firefox 20.
und hier? http://de.selfhtml.org/html/formulare/datei_upload.htmgenau dasselbe Verhalten. Aber mir ist eben aufgefallen, dass im Moment des Klickens noch ein Symbol ganz rechts in der Adresszeile erscheint: Firefox scheint den Dateiauswahl-Dialog, der eigentlich erscheinen sollte, als Popup zu bewerten, so dass sein Popup-Blocker ihn abfängt. Klicke ich auf das Symbol und lasse Popups für de.selfhtml.org zu, funktioniert das Upload-Control wie im Opera - einschließlich des (für mich) ärgerlichen Verhaltens, dass der Auswahldialog auch aufpoppt, wenn man das Textfeld anklickt.
Wie im Opera ist das Textfeld aber auch hier readonly.
Warum? Das ist doch Mumpitz!Ciao,
Martin--
Wenn alle das täten, wass sie mich können,
käme ich gar nicht mehr zum Sitzen.
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
-
-
-
Hallihallo!
Om nah hoo pez nyeetz, Der Martin!
Als Nutzer: Indem man einfach den im Eingabfeld eingetragenen Dateinamen wieder löscht.
Ähm - nö? http://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:HTML_input-Element10.html
Das gegebene Beispiel, mit dem aktuellen Chrome (39.0.2171.71 m) aufgerufen, bringt das Ergebnis, das ich aus Nutzersicht auch erwarte:
Klickt man nach der Auswahl einer "falschen" Datei ein zweites Mal auf den Durchsuchen-Button und schliesst den Filemanager mit "Abbrechen", so wird in dem Formularelement ein Reset ausgeführt und es ist wieder leer.
Beste Grüsse,
Tobias Hahner
-
-
-
ich bin mir nicht ganz sicher, ob du aus der Sicht des Formular-Erstellers fragst, der seinen Nutzern einfach etwas mehr Komfort bieten möchte, oder aus der Sicht des ratlosen Nutzers.
Beides ;)
Im Speziellen erstmal aus der Sicht des Erstellers, weil mir ein Nutzer diese Frage gestellt hat und ich nicht gedacht hätte, dass es dafür (z.B. in Firefox) keine einfache Lösung gibt...Wie im Opera ist das Textfeld aber auch hier readonly.
Warum? Das ist doch Mumpitz!Eben. Da fragt man sich, wer sich das ausgedacht hat.
Das Originalfeld aus dem DOM entfernen and stattedessen ein frisches einsetzen.
Das werde ich als Ersteller DIESES Formulares nun tun. Ist aber natürlich keine Lösung für alle anderen Formulare.
Vielen Dank für diesen Tipp. Ihr dürft aber über das Problem an sich gern weiterdiskutieren ;)
