JS/DOM - Formular dynamisch erstellen -> wie korrekt "onsubmit"?

[Steffen Maier]

Hallo liebes Forum.

Für mein aktuelles Projekt habe ich einen Datensatz in einer XML-Datei aus der ich eine Tabelle dynamisch generiere. Zusätzlich möchte ich eine Filterfunktion einbauen. Da sich die Filteroptionen aus den Daten der XML-Datei ergeben, muß dieses Formular auch dynamisch erstellt werden.

Dabei habe ich das Problem, wie ich diesem Formular korrekt ein onsubmit-Event mitgebe. Zwei mir bekannte Varianten habe ich überprüft die der FF3 beide umsetzt aber der IE6 nicht:

  
/* Variante 1 */  
 var form = document.createElement("form");  
 form.name = "filter";  
 form.onsubmit = tabellefiltern;  
  
/* Variante 2 */  
 var form = document.createElement("form");  
 form.name = "filter";  
 form.setAttribute("onsubmit", "tabellefiltern(); return false;");  

Weiß jemand wie ich das korrekt umsetze? Und, was in Variante 1 nicht gehen würde, dem Funktionsaufruf einen Parameter übergebe und mit "return false" ein Neuladen der Seite verhindere?

Viele Grüße, Steffen

[Cheatah]

Hi,

form.setAttribute("onsubmit", "tabellefiltern(); return false;");

  
mal abgesehen davon, dass kein Grund existiert, aus JavaScript heraus eine Funktionalität als String irgendwo einzubringen, wo dann aus dem String umständlich wieder eine ausführbare Funktionalität gemacht werden muss, gibt es zudem einen gewissen Problembrowser, der das einfach nicht tut.  
  

> Weiß jemand wie ich das korrekt umsetze?  
  
Mit Variante 1.  
  

> Und, was in Variante 1 nicht gehen würde, dem Funktionsaufruf einen Parameter übergebe und mit "return false" ein Neuladen der Seite verhindere?  
  
Das habe ich zwar nicht verstanden, aber ich vermute, Du möchtest statt einer Funktionsreferenz einfach eine anonyme Funktion zuweisen.  
  
Cheatah  

-- 
X-Self-Code: sh:( fo:} ch:~ rl:| br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|  
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html  
X-Will-Answer-Email: No  
X-Please-Search-Archive-First: Absolutely Yes

[molily]

Zwei mir bekannte Varianten habe ich überprüft die der FF3 beide umsetzt aber der IE6 nicht:

Ja, siehe https://redaktion.selfhtml.org/selfhtml-preview/javascript/einbindung.html#fehler-code-als-string. (SSL-Warnungen wegklicken.)

Und, was in Variante 1 nicht gehen würde, dem Funktionsaufruf einen Parameter übergebe

Zur Parameter übergabe siehe https://redaktion.selfhtml.org/selfhtml-preview/javascript/einbindung.html#fehler-handler-aufrufen

Der Einfachheit halber kannst du wie gesagt eine anonyme Wrapper-Funktion notieren:

form.onsubmit = function () {
   return tatsächlicherHandler(parameter1, parameter2, ...);
};
function tatsächlicherHandler () {
   ...
   return false;
}

und mit "return false" ein Neuladen der Seite verhindere?

Einfach am Ende der Handlerfunktion return false notieren.
https://redaktion.selfhtml.org/selfhtml-preview/javascript/einbindung.html#standardaktion

Mathias

[Felix Riesterer]

Lieber Steffen,

var form = document.createElement("form");

verwende einen anderen Variablennamen. "form" ist meines Wissens im IE bereits vorhanden und belegt.

Liebe Grüße,

Felix Riesterer.

[molily]

"form" ist meines Wissens im IE bereits vorhanden und belegt.

Nein. Mit was sollte es belegt sein?
Wenn es ein Element mit name oder id leich »form« gibt, dann ist window.form belegt. (Das ist hier aber nicht der Fall, das Formular hat den Namen filter.) Man kann das globale window.form dann nicht überschreiben, aber durchaus eine lokale Funktionsvariable mit diesem Namen deklarieren und ihr einen eigenen Wert zuweisen.

Mathias