[gelöst] Tabelle dynamisch erzeugen - Internet Explorer streikt

[francosdad]

Hallo,

ich habe eine kleine Funktion, welche auf meiner WebSeite die Leasingkonditionen abhängig vom Produktpreis anzeigen soll.
Das ganze wird über einen Link aktiviert, welcher die Funktion getLeasing() aufruft und die Ebene mit der Tabelle einblendet.

Das ganze habe ich einfach mit Hilfe einer Schleife über klasse createElement Befehle gelöst.

Funktioniert natürlich im Firefox ohne Probleme, nur mal wieder der Internet Explorer (getestet mit 6 und 7) weigert sich und meldet das die aufgerufenen Methoden nicht funktionieren.

Konrekt meint er die Zeile 104 im Quelltext, welche die folgende ist:

		tr[i] = document.createElement('tr');

Ich steh total auf dem Schlauch, denn wenn ich die Schleife entferne meldet er zwar keine Fehler mehr, erstellt aber auch nicht den Teil der Tabelle der ohne Schleife erstellt wird.

Ich bin für jeden Tipp dankbar.

Grüße Michael

P.S.: Zum Schluss natürlich noch der Quelltext:

<script type="text/javascript">

var duration = "15,24,30,36,42,48,60";
var rates = "10.5,9.5,8.5,7.5,6.5,5.5,4.5";
var ad = duration.split(",");
var ar = rates.split(",");
var exist = 0;

function runde(x, n) {
  if (n < 1 || n > 14) return false;
  var e = Math.pow(10, n);
  var k = (Math.round(x * e) / e).toString();
  if (k.indexOf('.') == -1) k += '.';
  k += e.toString().substring(1);
  return k.substring(0, k.indexOf('.') + n+1);
}


function calculate(i, value) {
	var mr = value / ad[i];
	var mrz = mr + (mr * ar[i] / 100);
	return runde(mrz, 2);
}

function getLeasing(price) {

if (exist == 0) {
	exist = 1;
	var d = document.getElementById('leasing');
		d.style.display = "block";
	var table = document.createElement('table');
		table.style.border = "none";
		table.style.width = "100%";
		table.cellspacing = "0";
	var tr = document.createElement('tr');
		tr.style.background = "#4A2005";
	var tdl = document.createElement('td');
	var tdltn = document.createTextNode('Laufzeit');
	var tdm = document.createElement('td');
	var tdmtn = document.createTextNode('monatliche Belastung (Brutto)');
	var tdr = document.createElement('td');
	var tdrtn = document.createTextNode('');
	var tdra = document.createElement('a');

	var tdratn = tdra.appendChild(tdrtn);

	var newtable = d.appendChild(table);

	var maint = newtable.appendChild(tr);
	var innertl = maint.appendChild(tdl);
	var innertm = maint.appendChild(tdm);
	var innertr = maint.appendChild(tdr);

		innertl.appendChild(tdltn);
		innertm.appendChild(tdmtn);
		innertr.appendChild(tdratn);

	for (var i = 0; i < ad.length; i++) {

		tr[i] = document.createElement('tr');
		tdl[i] = document.createElement('td');
		tdltn[i] = document.createTextNode(ad[i]+' Monate');
		tdm[i] = document.createElement('td');
		tdmtn[i] = document.createTextNode(calculate(i, price)+' Euro');
		tdr[i] = document.createElement('td');

		maint[i] = newtable.appendChild(tr[i]);
		innertl[i] = maint[i].appendChild(tdl[i]);
		innertm[i] = maint[i].appendChild(tdm[i]);
		innertr[i] = maint[i].appendChild(tdr[i]);
	
			innertl[i].appendChild(tdltn[i]);
			innertm[i].appendChild(tdmtn[i]);
			innertr[i].innerHTML = "<a href=\"http:\/\/www.grenkeleasing.com\/cgi-bin/shop-antrag.pl?userid=013-06549&upreis="+price+"\" target=\"_blank\">Angebot anfordern</a>";
			
	}
}
}
</script>

[wahsaga]

Der IE möchte, dass Tabellenzeilen dort eingehängt werden, wo sie hin gehören - in einen THEAD-, TBODY- oder TFOOT-Bereich.

Das werden sie zwar generell, aber in HTML kann man diese als optional weglassen; beim aufbauen des DOM erstellt der Browser diese dann ggf. selber. Nur was das erzeugen von Tabellenelementen per JS angeht, ist der IE etwas pingeliger.

(Und dieses "Problem" ist übrigens seit Jahren bekannt - also behaupte bitte nicht, du hättest beim Suchen nichts gefunden.)

[Kropff]

(Und dieses "Problem" ist übrigens seit Jahren bekannt ...)

Also ich kannte das auch noch nicht. Habe aber auch nie Tabellen per JS manipuliert.

Peter

[francosdad]

Hallo,

also mir war das nicht bekannt und ich bin nicht auf die Idee gekommen, dass das der Grund sein könnte.

Ich habe in Richtung createElement und setAttribute gesucht.

Aber kein Debuggin Plugin für den IE hat auch nur einen Fehler gemeldet oder einen Hinweis geliefert.

Ich werde das gleich mal probieren und danke für den Tipp.

Michael

[Kropff]

Ich habe in Richtung createElement und setAttribute gesucht.

Der IE kommt mit setAttribute nicht klar. Siehe auch hier. Eine Einführung zum Thema DOM-Manipulation findest du an dieser Stelle und ein Tutorial gibt es an selbiger Stelle. Vielleicht hilft es dir weiter.

Peter

@francosdad
Bitte nicht mit innerHTML arbeiten. Das tut mir in der Seele weh

@wahsaga

Der IE kommt mit setAttribute nicht klar.

Hast du das gewusst? SCNR

[wahsaga]

@wahsaga

Der IE kommt mit setAttribute nicht klar.

Hast du das gewusst? SCNR

Lass mich überlegen ...