Nach Dateiauswahl absenden

[dieter]

Hallo Leute,

ich habe ein Upload-Feld:

<input type="file" name="file" style="display: none;" />

Dieses ist dank "display: none" nicht sichtbar.

Über einen Link wird dann der Datei-Dialog geöffnet:

<a href="javascript:document.form.file.click()">Test</a>

Nun möchte ich noch, dass das Formular dann abgesendet wird, wenn man eine Datei ausgewählt hat.

Der Submit-Button soll also auch entfallen,

Hat jemand eine Idee, wie ich das bewerkstelligen kann?

[Gunther]

Hallo Dieter!

Hat jemand eine Idee, wie ich das bewerkstelligen kann?

Hast du dir schon mal <http://de.selfhtml.org/html/formulare/datei_upload.htm@title=Felder für Datei-Upload definieren> durchgelesen und das Beispiel ausprobiert?

Warum willst du das Rad neu erfinden und dann auch noch so, dass es nur mit JS funktioniert!?

Gruß Gunther

[dieter]

Hallo Dieter!

Hat jemand eine Idee, wie ich das bewerkstelligen kann?
Hast du dir schon mal <http://de.selfhtml.org/html/formulare/datei_upload.htm@title=Felder für Datei-Upload definieren> durchgelesen und das Beispiel ausprobiert?

Warum willst du das Rad neu erfinden und dann auch noch so, dass es nur mit JS funktioniert!?

Gruß Gunther

Bei dem Beispiel wird das Formular ja nicht abgesendet. Die Datei kann man auswählen, aber das Formular wird ja dann nicht abgesendet. Die lässt sich ja normalerweise mit einem Submit-Button machen, den ich aber nicht will. Es soll sich ja automatisch absenden.

[Gunther]

Hallo Dieter!

Die lässt sich ja normalerweise mit einem Submit-Button machen, den ich aber nicht will. Es soll sich ja automatisch absenden.

Das kannst du bspw. mit jQuery machen:
Dem Input Feld per .on() einen 'change' Handler zuweisen.

Dann würde ich es ggf. gleich per AJAX machen: jQuery Form Plugin

Gruß Gunther

[dieter]

Hallo Dieter!

Die lässt sich ja normalerweise mit einem Submit-Button machen, den ich aber nicht will. Es soll sich ja automatisch absenden.

Das kannst du bspw. mit jQuery machen:
Dem Input Feld per .on() einen 'change' Handler zuweisen.

Dann würde ich es ggf. gleich per AJAX machen: jQuery Form Plugin

Gruß Gunther

Nein... bitte ohne jQuery...

[Gunther]

Hallo Dieter/günther1911!

Nein... bitte ohne jQuery...

AFAIK ist die Sache mit dem Datei-Upload abhängig vom jeweiligen Browser und OS.

Ich kann jetzt auch nicht wirklich einen Unterschied darin erkennen, ob ich einen vom Browser generierten Button mit der Beschriftung "Durchsuchen" oder "Datei auswählen" habe, oder einen Link.

So oder so muss ich als User irgendwo draufklicken, damit ein lokaler Dateiauswahl-Dialog am Bildschirm erscheint.

Insofern kann man auch den Event-Handler 'onchange' für das Inputfeld verwenden (hat ms88-aut ja bereits gepostet).

Dieser löst bei mir im FF z.B. immer aus, sobald ich im Dateiauswahl-Dialog eine Datei ausgewählt habe, auch wenn es die selbe Datei ist, die bereits vorher in dem Feld stand. Chrome löst dagegen nur aus, wenn ich tatsächlich eine andere Datei auswähle.

Gruß Gunther

[ms88-aut]

Hi,
wenn ich das richtig verstanden habe mach einfach:

  
<form action=".." method="post" id="myform">  
...  
<input type="file" name="file" style="display: none;" onchange="submitMyForm()" />  
...  
  
</form>

  
<script type="text/javascript">  
function submitMyForm() {  
document.getElementById("myform").submit();  
}  
</script>

[Steffen]

Besser so ;-)

  
<form action=".." method="post">  
...  
<input type="file" name="file" style="display: none;" onchange="this.form.submit();" />  
...  
  
</form>

Grüße

• Steffen

[dieter]

Nein... bitte ohne jQuery...