Javascript & XML: Wie der Ausgabefunktion einen Parameter übergeben?

[ezzemm]

Hallo zusammen!

Für ein Projekt erstelle ich mittels Javascripts eine Tabelle; die Inhalte der Tabelle werden aus einem XML-File entnommen. Das Script dazu habe ich unten angehängt.

Soweit funktioniert das Ganze wunderbar, bei Seitenaufruf wird die Tabelle erstellt. Nur wäre es natürlich sinnvoll, wenn der Benutzer durch Aufruf eines Links oder Eingabe in einem Formular diese Tabelle modifizieren könnte; z.B. gewisse Zeilen ausblenden oder nach einer Spalte sortieren.

Ich habe schon folgendes ausprobiert: Wenn ich den Parameter mittels Link übergebe (<a href="Javascript:ausgeben(Parameter)">Text</a>), dann wird unter der beim Seitenaufruf erstellten Tabelle eine zweite Tabelle erstellt, wo die Änderungen durch den Parameter berücksichtigt ist.
Als Workaround könnte man sich vorstellen beim Aufruf der Funktion erst alle Kindelemente zu löschen, dann die Tabelle neu zu erstellen, dann würde es funktionieren.

Dann habe ich das auch noch mit einem Formular probiert, welches für meinen Fall sinnvoller wäre (<form name="formular" onsubmit="ausgeben(document.formular.parameter.value)">). Dann allerdings passiert folgendes: Wenn ich den Submit-Button klicke erscheint kurz unter der beim Laden der Seite erstellten Tabelle eine zweite, bei der der Parameter berücksichtigt wurde. Dann verschwindet diese zweite Tabelle wieder und es ist so wie beim Öffnen der Seite. Als ob das Formular einen Page-Refresh macht.


Nun meine Frage: Wie löse ich es am elegantesten daß ich meiner Ausgabefunktion Parameter mittels eines Formulars übergeben kann?



var http = null;
if (window.XMLHttpRequest) {
http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
http = new ActiveXObject("Microsoft.XMLHTTP");
}

window.onload = function() {
if (http != null) {
http.open("GET", "foobar.xml", true);
http.onreadystatechange = ausgeben;
http.send(null);
}
}

function ausgeben(parameter) {
if (http.readyState == 4) {
var tabelle = document.getElementById("foo");
var xml = http.responseXML;
var ergebnisse = xml.getElementsByTagName("bar");
// Hier wird die Tabelle erstellt
}
}

[Sphinx]

in dem du noch ein


... onsubmit="ausgeben(document.formular.parameter.value); return false;" ...


mit anhängst.

[ezzemm]

Danke, so funktionierts :)
Die vorher erstellte Tabelle zu löschen war dann auch nicht mehr schwer. Wieder ein Problem gelöst ;)

var tabelle = document.getElementById("foo");
while (tabelle.hasChildNodes()) {
tabelle.removeChild (tabelle.firstChild);
}

[Sephiroth]

Danke, so funktionierts :)
Die vorher erstellte Tabelle zu löschen war dann auch nicht mehr schwer. Wieder ein Problem gelöst ;)

var tabelle = document.getElementById("foo");
while (tabelle.hasChildNodes()) {
tabelle.removeChild (tabelle.firstChild);
}
Da bist du u.U. "schneller", wenn du den ganzen Zweig löschst und beim Aufbauen die eine Zeile für das Table-Element mit aufnimmst. ;)