Table delete row

cow

Mitglied
Hi @ all ;)

ich hätte da gerne nochmal ein Problem ;)

Und zwar habe ich ja mit den Div eine Dynamische Tabelle erstellt. Was eher Suboptimal leider war. Nun komme ich mal über eine andere Schiene ;). Aber hier hab ich auch wieder ein kleines Problem.

Js Code:
Code:
function addRow()
{
	$res = document.getElementById($tblname);
	$config.anzrows++;
	zeile = $config.anzrows;
	tcont=document.createElement('tr');
        td=document.createElement('td');
	zeile = $config.anzrows; 	
	td.innerHTML='Zeile: '+$config.anzrows;
	tcont.appendChild(td);


	
	td=document.createElement('td');
	td.innerHTML='<input type="checkbox" name="n" onclick = "return felder(tcont)">Netz<br><input type="checkbox" name="h" onclick = "felder(tcont)">Host<br><input type="checkbox" name="s"  onclick = "felder(tcont)">Solsoft-Gruppe';
	tcont.appendChild(td);


	

    $res.appendChild(tcont);

}



function felder(tcont)
{
	
        td=document.createElement('td');
	
	td=document.createElement('td');
	td.innerHTML='<textarea name="net" cols="30" rows="3"  onclick= ""></textarea>					<textarea name="bsch" cols="30" rows="3"    onclick= ""></textarea> ';	
	tcont.appendChild(td);
	
	td=document.createElement('td');
	td.innerHTML='<input type="checkbox" name="dev"> DEV<br>											<input type="checkbox" name="test"> TEST<br>														<input type="checkbox" name="pre"> PRELIVE<br>														  <input type="checkbox" name="live"> LIVE ';		
	tcont.appendChild(td);	


	
	tcont.appendChild(td);	
}

Mit dem Code kann ich mehrere Zeilen erstellen. Nur leider Klappt er mir beim Checken der Boxen immer nur beim Letzt Hinzugefügten Element die Text Felder Dran.

mein Html code =)
HTML:
<body  onload="addRow();">

	<table>
	<thead id = "tablehead" ></thead>

	<tbody id = "table" >
	</tbody>
	
	</table>

<input type="button" value="+" onclick="addRow();" />
<input type="button" onclick="delRow();" value ="-"/> 
</body>
</html>

Und das zweite wäre die Function delRow(), ist bei mir noch relativ leer weil ich ganz ehrlich noch nicht den Großen plan von Js habe : ), hat jemand ne Idee denk Ansatz für mich ;)

Über nochmals so gute und nette Hilfe wie das letzte mal würde ich mich freuen
Gruß The Cow
 
Moin,

Code:
onclick = "return felder(tcont)"

In tCont ist global die jeweils beim letzten Aufruf von addRow() erzeugte <tr> verfügbar, daher dies Verhalten.
Wenn du auf die <tr> zugreifen willst, in welcher sich die Checkbox befindet, probiere es so:

Code:
onclick = "return felder(this.parentNode.parentNode)"

this ist ein Zeiger auf die Checkbox
parentNode davon die <td>
parentNode davon die <tr>
 
ah sehrschön :) sowas hab ich mir gedacht habe aber wieder nur mit 1x parrentNode es Probiert ;), jetzt muss ich mir noch überlegen wie ich eine Zeile Löschen kann :)

Gruß
 
Hi,

es gibt die Methode deleteRow zum Löschen einer Zeile. Sie erwartet als Argument den Index der zu löschenden Zeile.

Das folgende Beispiel löscht die letzte Zeile aus dem TBody der ersten Tabelle im Dokument.
Code:
document.getElementsByTagName("table")[0].getElementsByTagName("tbody")[0].removeRow(document.getElementsByTagName("table")[0].getElementsByTagName("tbody")[0].length-1);

Ciao
Quaese
 
hier meine Lösung :)

Code:
function delRow()
{
	var lastrow = numRows($tblname);
	table = document.getElementById("table");
	table.deleteRow('lastrow');

}

thx an alle für eure Hilfe ;)

edit: Leider zufrüh gefreut habe gerade bemerkt das obwohl ich das letzt element mir erzähle

Code:
function numRows(table_id) {
    
                if (!document.getElementById || !document.getElementsByTagName) {
                        return;
                }
   
                var rows = document.getElementById(table_id).getElementsByTagName('tr');
                var numRows = 0;
                for (i = 0; i < rows.length; i++) {
                        numRows=numRows+1;
                }
                return numRows;
        }

ig das meine Löschen methode und löscht immer das erste Element was ja eher subotimal ist.

Gruß
 
Zuletzt bearbeitet:
Zurück