Frage von Plueschtier94, 18

JavaScript Form Submit - Cannot read property 'submit' of null?

Hallo ich mal wieder mit einem JS Problem.

Ich habe einen Button, der bei Klick einen Klick auf ein verstecktes input type file simuliert. Nach auswählen der Datei, soll direkt der Upload starten ohne weiteren Button zu drücken. Dazu folgender HTML Code (Sorry der Editor ist echt schrecklich hier)

Tut mir leid - HTML stellt er gar nicht hier da -.- 
auf jeden Fall habe ich auf das versteckte Input ein
onchange="submitFiles()"
Auf dem Button habe ich ein onclick="chooseFile()"

Folgender JavaScript Code:

function chooseFile() {
   document.getElementById("fileInput").click();
}
function submitFiles(){
    document.getElementById('formbilderall').submit();
}

Leider bekomme ich immer die oben genannte Fehlermeldung:

Uncaught Type Error: Cannot read property 'submit' of null

Vielleicht weiß ja hier jemand mehr dazu :/ Danke schonmal im Voraus.

Antwort
von mastema666, 10

Anscheinend wird das Formular, das angesprochen wird, nicht gefunden, möglicherweise falsche oder gar keine ID oder so, kann man ohne den Code schlecht sagen (kannst ihn ja ggf mal auf http://hastebin.com/ oder so posten).

Allgemein würde ich das ohne "onclick" machen, z.B. so: http://codepen.io/mastema/pen/EgKodW

(ok, mag Geschmackssache sein, aber ich versuche immer möglichst wenig HTML/CSS/JS(/PHP...) zu "vermischen" wenn nicht unbedingt nötig)

Kommentar von Plueschtier94 ,

Hier ich habe dir mal was eingefügt. 
vielleicht weißt du da weiter?

http://hastebin.com/owuhiduhaf.scala

Kommentar von Plueschtier94 ,

Danke für deine Mühe, den Fehler hätte man so nicht finden können. 
Ich habe ein Form Tag nicht geschlossen gehabt, was vor dem Code passiert.

Kommentar von mastema666 ,

Ok, mal gucken, also was mir so auffällt:

- Das "form" Attribut ist nur nötig, wenn das Input Feld außerhalb des Formulars ist, und dann muss das Formular auch den entsprechenden Namen haben (nicht die ID). In diesem Fall kannst du aber 

form="formbilderall"

komplett weg lassen, da sich das Feld ja sowieso noch innerhalb des Formulars befindet.

- Du schreibst, dass es mit 

document.getElementById("fileInput").submit()

nicht funktioniert, allerdings müsstest du da auch die ID des Formulars angeben (inkl "#"), nicht die des Input Feldes. Allgemein würde ich da btw jQuery benutzen, ist zwar nicht zwingend nötig, aber macht vieles einfacher / kürzer, z.B. so:

$('#formbilderall').submit();

zum Abschicken des Formulars.

- Das versteckte Submit-Feld ist dabei übrigens gar nicht nötig, allgemein aber reicht "display: none;" um ein div nicht anzeigen zu lassen, ist kürzer als deine Variante und zudem könnte man ein so verstecktes div auch recht einfach wieder einblenden falls nötig.

- Auf onclick würde ich wie gesagt ganz verzichten und das triggern komplett ins JS verlagern.

Antwort
von StevenHornmann, 9

Ich vermute mal deine Form hat nicht die id "formbilderall"

Keine passende Antwort gefunden?

Fragen Sie die Community

Weitere Fragen mit Antworten