DOM ....... cancellazione riga tabella dinamica

**xalfryx** · 02-09-2004, 11:46

Ciao a tutti/e,
ho bisogno di un grande aiuto perchè sto veramente uscendo di "melone"

Riporto qui di seguito il codice e in più vi allego il print screen della tabella risultato....io in pratica devo, cliccando un tasto Canc qualsiasi, cancellare la riga corrispondente!!

function aggiungi(){

var valore=0;

if (document.createElement && document.getElementsByTagName) { // controllo accesso alle funzionalità DOM

tabella=document.createElement('TABLE');
corpotab=document.createElement('TBODY');

corpo=document.getElementById("tasti").parentNode;

riga=document.createElement('TR');
cella=document.createElement('TD');

// num_difetti=document.getElementById("num_dif");
valore1=document.inserisci.numdif.value;
++valore1;
valore=valore1+1;
document.inserisci.numdif.value=valore1;

voce=document.getElementById("qta");
voceclone=voce.cloneNode(true);
nome1='a'+valore;
voceclone.firstChild.firstChild.firstChild.firstCh ild.firstChild.firstChild.setAttribute("value",0);
voceclone.firstChild.firstChild.firstChild.firstCh ild.firstChild.firstChild.setAttribute("name",nome 1);
riga.appendChild(voceclone);

voce=document.getElementById("d1l");
voceclone=voce.cloneNode(true);
nome2='b'+valore;
voceclone.firstChild.firstChild.firstChild.firstCh ild.firstChild.firstChild.setAttribute("name",nome 2);
riga.appendChild(voceclone);

voce=document.getElementById("d2l");
voceclone=voce.cloneNode(true);
nome3='c'+valore;
voceclone.firstChild.firstChild.firstChild.firstCh ild.firstChild.firstChild.setAttribute("name",nome 3);
riga.appendChild(voceclone);

voce=document.getElementById("rot");
voceclone=voce.cloneNode(true);
nome4='d'+valore;
voceclone.firstChild.firstChild.firstChild.firstCh ild.firstChild.setAttribute("name",nome4);
riga.appendChild(voceclone);

voce=document.getElementById("tasti");
voceclone=voce.cloneNode(true);
nome5=valore;
voceclone.firstChild.firstChild.firstChild.firstCh ild.nextSibling.firstChild.setAttribute("name",nom e5);
riga.appendChild(voceclone);

corpo.appendChild(riga);
}

}

function cancella(nome)
{
corpo=document.getElementById("modello");

}

<TABLE id=tab_som>

<TR>
<TH><TABLE>
<TR><TD>Quantità</TD></TR>
</TABLE>
</TH>

<TH><TABLE>
<TR><TD>Difetto 1L</TD></TR>
</TABLE>
</TH>
<TH><TABLE>
<TR><TD>Difetto 2L</TD></TR>
</TABLE>
</TH>
<TH><TABLE>
<TR><TD>Rottamato</TD></TR>
</TABLE>
</TH>
<TH><TABLE>
<TR><TD>Inserisci/Cancella</TD></TR>
</TABLE>
</TH>
</TR>

<TR id=modello >

<TD id=qta>
<TABLE>
<TR><TD>
<INPUT ..........................>
</TD></TR></TABLE>
</TD>

<TD id=d1l>
<TABLE><TR><TD>
<drop down menu ..................> </TD></TR></TABLE>
</TD>

<TD id=d2l>
<TABLE><TR><TD>
<drop down menu ...................> </TD></TR></TABLE>
</TD>

<TD id=rot>
<TABLE>
<TR><TD>
<INPUT tabindex=17 type="Checkbox" name="d1" value=true>
</TD></TR></TABLE>

</TD>

<TD id=tasti>
<TABLE>
<TR><TD>
<input tabindex=18 type = "button" value ="Inser" onClick="aggiungi()">
</TD>
<TD>
<input tabindex=19 type="button" value ="Canc" name="1" onClick="cancella(this.name)">
</TD>
</TR>
</TABLE>
</TD>
</TR>

</TABLE>

**standard** · 02-09-2004, 14:47

dai un'occhiata a quest'esempio e al suo codice:

http://pro.html.it/esempio/dom/domLe...eggerow3c.html

(la teoria la trovi negli articoli in firma)
ciauz

**badaze** · 02-09-2004, 15:38

Prova questo script ....

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
.normal1 {font-family:tahoma;font-size:8pt;background-color:yellow}
.normal2 {font-family:tahoma;font-size:8pt;background-color:white}
.overTR  {font-family:tahoma;font-size:8pt;background-color:blue;color:white}
.clicked {font-family:tahoma;font-size:8pt;background-color:red;color:white}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
var aTR = null;
var aTbody = null;

function selectRow(aTD) {
 if (aTD.tagName == 'TD') {
  aTR     = aTD.parentElement;
	aTbody  = aTR.parentElement;
	document.getElementById('canc').disabled = false;
 } // if (aTD.tagName == 'TD')
} // function selectRow(aTD)

function _deleteRow(aTD) {
 if (aTR != null) {
	aTbody.deleteRow(aTR.rowIndex);
	aTR    = null;
	aTbody = null;
	document.getElementById('canc').disabled = true;
 } else {
  alert('Cliccare la riga da cancellare'); 
 } // if (aTR != null)
} // _deleteRow(aTD)
//-->
</script>


</head>
<body>
<table summary="" cellpadding="0" onclick="selectRow(event.srcElement)">
<tr  class="normal1" >
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
</tr>
<tr  class="normal2" >
<td>BBBBBBBBBBBBBBBBBBBBB</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
</tr>
<tr  class="normal1" >
<td>CCCCCCCCCCCCCCCCCCCCC</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
</tr>
<tr  class="normal2" >
<td>DDDDDDDDDDDDDDDDDDDDD</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
<td>AAAAAAAAAAAAAAAAAAAAA</td>
</tr>
</table>


<span style="font-family:tahoma;font-size:8pt">cliccare su una riga per attivare il bottone</style>

<input type="button" value="Canc" id="canc" disabled onclick="_deleteRow()">

</body>
</html>

Discussione: DOM ....... cancellazione riga tabella dinamica

Strumenti discussione

Ricerca discussione

Visualizza

DOM ....... cancellazione riga tabella dinamica

Permessi di invio