LinkBack URL
About LinkBacks
Hallo,
ich will mit JavaScript mehrere CheckBoxen in einer Form/div löschen.
Für die Fehlersuche (Fehler: Objekt erforderlich) habe ich zwei Varianten erstellen. In der ersten Variante werden die CheckBoxen mit dem Laden der Seite erzeugt. Ein Klick auf den Button Löschen löscht wie gewünscht alle CheckBoxen.
In der zweiten Variante werden die CheckBoxen mit JavaScript erzeugt (Button neuer Eintrag). Nach einem Klick auf den Button Löschen wird die Fehlermeldung "Objekt erforderlich" angezeigt.
Form-Name und div-Namen sind in beiden Varianten gleich. Der Unterschied liegt nur im Erzeugen der CheckBoxen. Offensichtlich werden die CheckBoxen mit JavaScript anders "abgelegt", so dass beim Löschen die Knoten nicht stimmen.
Hat jemand eine Lösung von euch, damit auch Variante zwei funktioniert?
Steffan
VARIANTE 1
<body>
<input type="button" name="btnLöschen" value="Löschen"
onclick="loeschen();">
<br><br>
<form action="main.php" name="Schraube" method="post" style="font:0.8em Verdana; color:#708090;
height:350px; width:250px; background:#E7E7E7; margin-left:10px; padding:5px; overflow:hidden; float:left">
<div style="width:100%; height:88%; overflow:auto; margin-top:5px">
<div id="Schrauben" style="width:200%">
<input type="checkbox" name="SchraubeX" value="0"> Eintrag1 <br>
<input type="checkbox" name="SchraubeX" value="0"> Eintrag2 <br>
<input type="checkbox" name="SchraubeX" value="0"> Eintrag3 <br>
<input type="checkbox" name="SchraubeX" value="0"> Eintrag4 <br>
<input type="checkbox" name="SchraubeX" value="0"> Eintrag5 <br>
</div>
</div>
</form>
<script type="text/javascript">
function loeschen() {
for (var j=document.Schraube.elements.length-1; j>=0; j--) {
if(document.Schraube.elements[j].type == 'checkbox') {
var node01 = document.getElementById('Schrauben');
var node02 = document.getElementById(document.Schraube.elements[j].name);
var node03 = document.getElementById(document.Schraube.elements[j].name).nextSibling;
node01.removeChild(node02);
node01.removeChild(node03);
}
}
}
</script>
</body>
VARIANTE 2
<body>
<input type="button" name="btnLöschen" value="Löschen" onclick="loeschen();">
<input type="button" name="btnNeu" value="neuer Eintrag" onclick="neueEintraege();">
<br><br>
<form action="main.php" name="Schraube" method="post" style="font:0.8em Verdana; color:#708090;
height:350px; width:250px; background:#E7E7E7; margin-left:10px; padding:5px; overflow:hidden; float:left">
<div style="width:100%; height:88%; overflow:auto; margin-top:5px">
<div id="Schrauben" style="width:200%">
</div>
</div>
</form>
<script type="text/javascript">
function loeschen() {
for (var j=document.Schraube.elements.length-1; j>=0; j--) {
if(document.Schraube.elements[j].type == 'checkbox') {
var node01 = document.getElementById('Schrauben');
var node02 = document.getElementById(document.Schraube.elements[j].name);
var node03 = document.getElementById(document.Schraube.elements[j].name).nextSibling;
node01.removeChild(node02);
node01.removeChild(node03);
}
}
}
function neueEintraege() {
for (var i=0; i<6; i++){
//---------- CheckBox erzeugen ----------
var objCheckBox = document.createElement("input");
objCheckBox.type = "checkbox";
objCheckBox.name = "SchraubeX";
objCheckBox.value = "0";
document.getElementById('Schrauben').appendChild(objCheckBox);
//---------- Bezeichnung für die CheckBox erzeugen ----------
var strCheckBoxText = document.createTextNode('Schraube ' + i);
document.getElementById('Schrauben').appendChild(strCheckBoxText);
//---------- Zeilenumbruch ----------
var objBr = document.createElement("br");
document.getElementById('Schrauben').appendChild(objBr);
}
}
</script>
</body>
Zitieren
Zitat von hesst
Lesezeichen