Neue input-Felder per JS generieren

[metno]

Hallo zusammen

Ich habe ein JS geschrieben, dass eine Tabelle um jeweils zehn Zeilen mit input-Felder als Inhalt erweitert. Leider funktioniert es nur im Firefox, der IE will nicht. Was könnte daran falsch sein?

var num = 11;
function morePics(num) {
	for(i=1; i <= 10; i++) {
		var newtr = document.getElementById("pics").appendChild(document.createElement("tr"));
		var newth = newtr.appendChild(document.createElement("th"));
		var newtd = newtr.appendChild(document.createElement("td")).appendChild(document.createElement("input"));
		newth.style.textAlign = "right";
		newth = newth.appendChild(document.createElement("input"));
		newth.type = "radio";
		newth.name = "Startbild";
		newth.value = num;
		newtd.type = "file";
		newtd.name = "pic["+num+"]"
		newtd.size = "30";
		
		
		num++;
	}
	return num;

}

Aufgerufen wird es per

num = morePics(num);

Das Skript in aktion findet ihr unter http://wila.selfip.com/SCT/index.php?site=14&action=add

Warum funktioniert das nicht?

 

[Quaese]

Hi,

zunächst erwartet der IE, dass neue Zeilen in den tbody und nicht das table-Element eingehängt werden.

Weiterhin kennt der IE die Eigenschaft type bei input-Elementen nicht, so dass die Zuweisung einen Fehler erzeugt. Abhilfe schafft hier ein IE-spezifischer Aufruf der Methode createElement.

Zuletzt hast du in der zweiten Zelle bereits ein input-Element eingehängt. In dieses willst du ein Element zum Dateiupload einhängen - das quittiert der IE ebenfalls als Fehler.

function morePics(num) {
  for(i=1; i <= 10; i++) {
    var newtr = document.getElementById("pics").getElementsByTagName("tbody")[0].appendChild(document.createElement("tr"));
    var newth = newtr.appendChild(document.createElement("th"));
    var newtd = newtr.appendChild(document.createElement("td")); // -> Diesen Teil auskommentieren.appendChild(document.createElement("input"));
    newth.style.textAlign = "right";
    if(document.all && !window.opera){
      // IE-eigene Notation um ein input mit Typ zu erstellen
      newth = newth.appendChild(document.createElement("<input type=\"radio\">"));
    }else{
      newth = newth.appendChild(document.createElement("input"));
      newth.type = "radio";
    }
    newth.name = "Startbild";
    newth.value = num;

    if(document.all && !window.opera){
      // IE-eigene Notation um ein input mit Typ zu erstellen
      newtd = newtd.appendChild(document.createElement("<input type=\"file\">"));
    }else{
      newtd = newtd.appendChild(document.createElement("input"));
      newtd.type = "file";
    }
    newtd.name = "pic["+num+"]"
    newtd.size = "30";

    num++;
  }
  return num;
}

Vielleicht hilft dir das weiter.

Ciao
Quaese

 

[metno]

Hi,

zunächst erwartet der IE, dass neue Zeilen in den tbody und nicht das table-Element eingehängt werden.

Weiterhin kennt der IE die Eigenschaft type bei input-Elementen nicht, so dass die Zuweisung einen Fehler erzeugt. Abhilfe schafft hier ein IE-spezifischer Aufruf der Methode createElement.

Zuletzt hast du in der zweiten Zelle bereits ein input-Element eingehängt. In dieses willst du ein Element zum Dateiupload einhängen - das quittiert der IE ebenfalls als Fehler.

function morePics(num) {
  for(i=1; i <= 10; i++) {
    var newtr = document.getElementById("pics").getElementsByTagName("tbody")[0].appendChild(document.createElement("tr"));
    var newth = newtr.appendChild(document.createElement("th"));
    var newtd = newtr.appendChild(document.createElement("td")); // -> Diesen Teil auskommentieren.appendChild(document.createElement("input"));
    newth.style.textAlign = "right";
    if(document.all && !window.opera){
      // IE-eigene Notation um ein input mit Typ zu erstellen
      newth = newth.appendChild(document.createElement("<input type=\"radio\">"));
    }else{
      newth = newth.appendChild(document.createElement("input"));
      newth.type = "radio";
    }
    newth.name = "Startbild";
    newth.value = num;

    if(document.all && !window.opera){
      // IE-eigene Notation um ein input mit Typ zu erstellen
      newtd = newtd.appendChild(document.createElement("<input type=\"file\">"));
    }else{
      newtd = newtd.appendChild(document.createElement("input"));
      newtd.type = "file";
    }
    newtd.name = "pic["+num+"]"
    newtd.size = "30";

    num++;
  }
  return num;
}

Vielleicht hilft dir das weiter.

Ciao
Quaese

Du bist ein Schatz ;-). Danke vielmals jetzt klappts.