submit is not a function

[DiDiJo]

Hi Leute,

ich verzweifele gerade an einer simplen JS Anweisung.

Ich habe ein Formular mit Submitbuttons. Allerdings soll möchste das Formular schon abschciken, sobald man einen bestimmten Radio-Button gedrückt hat.

An sich nix kompliziertes:

Hier mal ein grober Aufbau von meinem Formular:

<form action="<?=$PHP_SELF?>" method="post" enctype="multipart/form-data" name="editpage" id="editpage" onsubmit="return checkForm(document.forms['editpage'],false);">

<div>
  diverse inhalte
  <input title="Seitentyp" type="radio" name="siteType" value="PORTAL" onclick="document.getElementById('editpage').submit()"/>
  <input title="Seitentyp" type="radio" name="siteType" value="CONTENT" onclick="this.form.submit()"/>
  <input title="Seitentyp" type="radio" name="siteType" value="BLA1" onclick="document.forms['editpage'].submit()"/>
  <input title="Seitentyp" type="radio" name="siteType" value="BLA1" onclick="document.editpage.submit()"/>
</div>

<div>
  diverse inhalte
  <input type="submit" name="submit" value="Alles speichern" />
</div>

<div>
  diverse inhalte
  <!-- ich weiß hier stehen doppelte Namen. Die soltlen aber nicht für das Problem verantwortlich sein-->	
  <input type="submit" name="submit" value="Alles speichern" />
</div>
</form>

Kann mir bitte einer erklären warum keins dieser JS-Codes (in den Radio-Boxen) funktioniert.

Ich bekomme ständig den Fehler, dass submit() keine Funktion ist. Ich habe auch schon den Quelltext meiner Seite überprüft ob ich ggf. dieses editpage mehrfach benutze --> Fehlanzeige.

Um die Formularprüfung einzubauen habe ich auch folgendes versucht:

<input title="Seitentyp" type="radio" name="siteType" value="CONTENT" onclick="if(checkForm(document.forms['editpage'],false)) {this.form.submit();}"/> <strong>Inhaltsseite</strong>

Das funktioniert genausowenig. Die CheckForm Funktion wirft übrigens true oder false zurück ... je nachdem ob Fehler gefunden worden oder nicht.

Ich hoffe jemand kann mir helfen ... ich krieg langsam nen dicken HALS ******

Mit freundlichen Grüßen

Daniel Schmidt

 

[ComFreek]

Hallo Daniel,

ich habe gerade den Fehler mittels Testen gefunden. Der Fehler ist, dass der Browser denkt, dass du mittels document.getElementById("editpage").submit() auf das Input-Feld, das auch so heißt, zugreifen möchtest.
Allerdings ist dieses dann ein Objekt (vom Typ Input-Feld) und keine Funktion!

Also ist die Lösung ziemlich einfach: Den Submit-Button umbenennen!

Übrigens würde ich folgende Schreibweise - wie du es beim ersten Input-Feld getan hast - für onclick empfehlen:

document.getElementById('editpage').submit();

 

[tombe]

Ich glaube das eben die gleichen Namen das Problem sind. Vergeben mal für jedes Objekt einen eigenen Namen und rufe das Submit-Ereignis so auf:

onclick="document.editpage.submit();"

dann sollte es klappen.

 

[DiDiJo]

Hallo Daniel,

ich habe gerade den Fehler mittels Testen gefunden. Der Fehler ist, dass der Browser denkt, dass du mittels document.getElementById("editpage").submit() auf das Input-Feld, das auch so heißt, zugreifen möchtest.

Ok ich werde das mal mit den verschiedenen Namen für den Submit ausprobieren.
Aber ich habe auf der gesamten Seite kein Feld was editpage heißt. Der Name wurde NUR beim Form-Tag benutzt und zwar als ID und name. Dweshalb bin ich so verwundert, dass es irgendwas mit den Knöppen zu tun haben soll ...

Mfg DiDi

 

[ComFreek]

Aber ich habe auf der gesamten Seite kein Feld was editpage heißt. Der Name wurde NUR beim Form-Tag benutzt und zwar als ID und name. Dweshalb bin ich so verwundert, dass es irgendwas mit den Knöppen zu tun haben soll ...

Einen Namen kann man übrigens mehrmals im Dokument nutzen! Im Gegensatz zu einer ID, die eindeutig sein muss.

Um es etwas deutlicher zu machen:

Nun, um das Problem zu verstehen, muss man wissen, dass man mittels Form-Objekt auch auf die einzelnen Felder per Namen zugreifen kann.
Beispiel:

<form id="the_form">
  <input type="text" name="first_field" />
</form>

var form_obj = document.getElementById("the_form"); // Das Form-Objekt im DOM
alert(form_obj.first_field); // liefert in Chrome: [object HTMLInputElement]

Außerdem gibt es noch die Funktion submit() bei jedem Form-Objekt, die das Formular abschickt.

Jetzt war das Problem hier, dass ein gleichnamiges Input-Element (Submit-Button) erstellt hast. Dieses hat die submit()-Funktion überschrieben! Von daher versuchtest du immer das Input-Element als Funktion aufzurufen -> Fehler!