[js-dhtml]puntare a righe di una tabella create dinamicamente

**afrappe** · 15-09-2005, 12:37

ho una tabella al quale ho aggiunto delle righe dinamicamente con

codice:

var miaRiga;
miaRiga = miaTabella.insertRow()
miaRiga.setAttribute('id','ciccio')
miaRiga.setAttribute('name','ciccio')
...
...

vorrei risalire all'indice della riga cercandola per nome o per id

codice:

var rigaCercata 
rigaCercata= miaTabella.rows('ciccio').rowIndex;

mi da un'errore('object required') che mi fa pensare che non sia possibile puntare ad un oggetto per nome o id ma l'MSDN dice il contrario
per sicurezza ho provato a mettere al posto di 'ciccio' un indice numerico e in questo caso funziona
che cavolo sbaglio

dall'MSDN

codice:

ms-help://MS.VSCC.2003/MS.MSDNQTR.2003FEB.1033/DHTML/workshop/author/dhtml/reference/collections/rows.htm


rows Collection

--------------------------------------------------------------------------------

Retrieves a collection of tr (table row) objects from a table object.

Syntax

[ oColl = ] object.rows 
[ oObject = ] object.rows(vIndex [, iSubIndex]) 

Possible Values

oColl Array of tr objects.  
oObject Reference to an individual item in the array of elements contained by the object. 
vIndex Required. Integer or string that specifies the element or collection to retrieve. If this parameter is an integer, the method returns the element in the collection at the given position, where the first element has value 0, the second has 1, and so on. If this parameter is a string and there is more than one element with the name or id property equal to the string, the method returns a collection of matching elements. 
iSubIndex Optional. Position of an element to retrieve. This parameter is used when vIndex is a string. The method uses the string to construct a collection of all elements that have a name or id property equal to the string, and then retrieves from this collection the element at the position specified by iSubIndex.

**badaze** · 15-09-2005, 17:43

Hai provato ?

codice:

var rigaCercata 
var curRow = miaTabella.rows('ciccio');
rigaCercata= curRow.rowIndex;

**afrappe** · 16-09-2005, 15:58

stesso errore

**badaze** · 16-09-2005, 16:17

Prova questo
Clicca sul bottone per creare delle righe e poi su una cella. Ti darà l'indice della riga nella tabella

codice:

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

<html>
<head>
<title>Untitled</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
var idTR =0;
function addRow() {

  parentTBody   = document.getElementById('miaTabella');
  //
	newRow      = parentTBody.insertRow();
	newRow.id   = 'ciccio'+(idTR++);
	for (i=0;i<4;i++) {
	 newCell             = newRow.insertCell();
	 newCell.className   = "unselectedTD";
	 newCell.innerHTML   = "";
	 newCell.vAlign      = "top";
	 newCell.border      = "1";
	 newCell.width       = "150";
	 newCell.onclick     = getRow;
	} // for (i=0;i<4;i++)

} // function addRow() 

function getRow() {
 rowId       = this.parentElement.id; // l'id del TR di cui la cella fa parte
 curRow      = document.getElementById('miaTabella').rows(rowId);
 rigaCercata = curRow.rowIndex;
 alert(rigaCercata);
}
//-->
</script>

<table summary="" id="miaTabella" border="1">
</table>
<hr>
<input type="button" value="Add row" onclick="addRow()">
</body>
</html>

**afrappe** · 16-09-2005, 16:23

ok lunedi provero e ti faro sapere, ne frattempo grazie e buon finesettimana ;-)

**afrappe** · 19-09-2005, 09:31

PURTROPPO ANCORA NIENTE, POSTO IL CODICE MAGARI RIUSCITE AD AIUTARMI

codice:

<html>


<head>
<script>
var _riga;
var _cella;
var _nodoTesto;
var _boxPrezzo;



function eliminaArticolo()
{




	rowId       = this.parentElement.id; // l'id del TR di cui la cella fa parte
 	curRow      = document.getElementById('TAB_REP_ARTICOLI').rows(rowId);
 	rigaCercata = curRow.rowIndex;
	alert(rigaCercata);




}



function aggiungiArticolo(idArticolo)
{
	
	
	var articolo = 'eee';
	var quantita  = 3;
	var descrizione  = 'mobile';
	var prezzoUnitario  = 100;
	var sconto  = 10;
	var ricarico  = 16;
	
	_riga = tab_rep_articoli.insertRow();
	
	
	_riga.setAttribute('id','tr' + idArticolo);   
	_riga.setAttribute('name','tr' + idArticolo);   
	_riga.setAttribute('class','reportPari');
	
	//creo la cella "quantità"   
	_cella = document.createElement("<td>");
	_nodoTesto = document.createTextNode(quantita);
	_cella.appendChild(_nodoTesto);
	_riga.appendChild(_cella);

	//creo la cella "articolo"
	_cella = document.createElement("<td>");
	_nodoTesto = document.createTextNode(articolo);
	_cella.appendChild(_nodoTesto);
	_riga.appendChild(_cella);
		
	//creao la cella "descrizione"
	_cella = document.createElement("<td>");
	_nodoTesto = document.createTextNode(descrizione);
	_cella.appendChild(_nodoTesto);
	_riga.appendChild(_cella);
	
	//creao la cella "prezzoUnitario"    
	_cella = document.createElement("<td>");
	//_nodoTesto = document.createTextNode(prezzoUnitario);
	//_cella.appendChild(_nodoTesto);
	
	_boxPrezzo = document.createElement("<INPUT>");
	_boxPrezzo.setAttribute('type','text');
	_riga.setAttribute('id','prezzo' + articolo);
	_boxPrezzo.setAttribute('value',prezzoUnitario);
	_boxPrezzo.setAttribute('style','width:30');
		
	_cella.appendChild(_boxPrezzo);
	_riga.appendChild(_cella);
	
	//creo la cella "prezzoTotale" - campo calcolato 
	var _prezzoTotale;
	_prezzoTotale = prezzoUnitario * quantita;
	
	_cella = document.createElement("<td>");
	_nodoTesto = document.createTextNode(_prezzoTotale);
	_cella.appendChild(_nodoTesto);
	_riga.appendChild(_cella);
	
	
	//####################################################meglio mettere l'icona del cestino al posto del pulsante
	//creo la cella con il tasto per cancellare la riga
	var _pulsante;
	_cella = document.createElement("<td>");
	_pulsante = document.createElement("<input>");  //sostituita con icona del cestino
	_pulsante.setAttribute('type','button');        //sostituita con icona del cestino
	_pulsante.setAttribute('value','cancella');     //sostituita con icona del cestino


	

	

	
        _pulsante.attachEvent('onclick',function(){eliminaArticolo()});
		
	_cella.appendChild(_pulsante);   //appendo il pulsante nella cella

	var _hidden;  //creo l'hidden con 'idarticolo
	_hidden = document.createElement("<input>");
	_hidden.setAttribute('type','text');
	_hidden.setAttribute('value',idArticolo);
	
	_cella.appendChild(_hidden);  //appendo l'hidden nella cella
	
	//creo l'hidden con lo sconto dell'articolo
	_hidden = document.createElement("<input>");
	_hidden.setAttribute('type','text');
	_hidden.setAttribute('value',sconto);
	
	_cella.appendChild(_hidden);  //appendo l'hidden nella cella
	
	//CREO l'hidden con il ricarico dell'articolo
	_hidden = document.createElement("<input>");
	_hidden.setAttribute('type','text');
	_hidden.setAttribute('value',ricarico);
	
	_cella.appendChild(_hidden);  //appendo l'hidden nella cella
	
	_riga.appendChild(_cella);   //appendo la cella con il pulsante e gli hiddens nella riga
	
}



</script>
</head>

<body>

	<table id="tab_rep_articoli" name="tab_rep_articoli"> 
	  <tr>
	  	<td>Intestazione1</td>
	  	<td>Intestazione2</td>
	  </tr>
	</table>
	
	<input type="button" onclick="javascript:aggiungiArticolo(5);" value="aggiungi">
</body>

**badaze** · 19-09-2005, 09:57

Ho modificato alcune righe del tuo script.
Comunque stai attento al fatto che tutti i tr hanno lo stesso id.

codice:

function eliminaArticolo()
{
  // button che ha sparato l'evento onclick
  anInput     = event.srcElement;
  //               input -> td         -> tr        -> Indice
  rigaCercata   = anInput.parentElement.parentElement.rowIndex; 
  alert(rigaCercata);

}

**afrappe** · 19-09-2005, 10:11

EVVAI FUNZIONA ALLA GRANDE

GRAZIE BELLO DE ZIO

ora devo cancellare la riga

rigaCercata = anInput.parentElement.parentElement;

tab_rep_articoli.removeChild(rigaCercata);

mi da un problema sulla cancellazione(invalid argument) l'msdn dice che il parametro deve essere di tipo "node" e parentElement tira fuori proprio quello giusto?
non capisco

Discussione: [js-dhtml]puntare a righe di una tabella create dinamicamente

Strumenti discussione

Ricerca discussione

Visualizza

[js-dhtml]puntare a righe di una tabella create dinamicamente

Permessi di invio