[Résolu] Copie entre Tables HTML

(Re)Bonjour,

Comme vous le voyez je me met au JavaScript et je reste pas sans problème

Bon, alors cette fois, je cherche à copier des lignes d'un premier tableau HTML, dans un second tableau HTML.
Le premier tableau comporte un bouton radio sur chaque ligne, qui permettra de sélectionner la ligne à copier dans le second.

Pour obtenir les informations du premier tableau j'utilise des id pour les cellules, ce qui ne pose aucun problème. Pour écrire dans le second tableau, j'utilise innerHTML, là aussi, pas de problème.
Mais lorsqu'il s'agit d'utiliser une variable pour dire d'écrire les contenus des id grâce au innerHTML, ça bloque.

Voici un peu comment se trouve le premier tableau. La première colonne comporte les boutons radio, avec des value. Les autres colonnes comporte des noms, prénoms, etc... avec un id pour chaque cellule.

XXX | Col 0 | Col 1 | Col 2 | Col 3...
Lgn1 | V=0 | Id0,1 | Id0,2 | Id0,3
Lgn2 | V=1 | Id1,1 | Id1,2 | Id1,3
Lgn3 | V=2 | Id2,1 | Id2,2 | Id2,3
...

Dans mon code JavaScript, je donne à i la value du bouton radio checked, qui correspond alors à la ligne.
Pour copier la ligne sélectionnée, je souhaitai donc copier "i,1+i,2+i,3", mais le problème arrive lorsque je découvre que innerHTML ne prend pas en compte les variables javascript et cherche uniquement les id dans le HTML.

Ma question est donc :
Connaissez-vous une fonction tel que innerHTML mais qui utiliserai les variables dans le JavaScript au lieu des id du HTML, comme valeur à écrire dans le tableau HTML ?

Afin que je puisse faire quelque chose dans ce genre :

i+",1".innerHTML
i+",2".innerHTML
etc.

Qui permettrai donc d'avoir des valeurs d'id différent selon la valeur de la variable i.

Merci beaucoup pour le temps que vous consacrez.
Modifié par Zetura (04 Jul 2008 - 11:26)

a écrit :
je découvre que innerHTML ne prend pas en compte les variables javascript et cherche uniquement les id dans le HTML.

Sauf ton respect, visiblement tu t'emmêles...
innerHTML sert à récupérer ou fixer le contenu d'un "élement". Ton problème est sans doute plutôt de récupérer le(s) bon(s) élément(s) (cellule(s) de tableaux).

en rapide :

<script type="text/javascript">
...
  var L = 3; // numéro de ligne
  var C = 4; // colonne
  var cellT1 = document.getElementById("T1L" + L + "C" + C);
  var cellT2 = document.getElementById("T2L" + L + "C" + C);
  cellT2.innerHTML = cellT1.innerHTML; // copie du contenu...
...
</script>
...
<table id="T1">
...
... <td id="T1L3C4">cellule à copier</td> ...
...
</table>
<table id="T2">
...
... <td id="T2L3C4">cellule cible</td> ...
...
</table>

Hé bien en fait, non.

Avec GetElementById, un autre problème survient lorsqu'il veut prendre les informations des cellules.
A la place de prendre leurs contenus, il m'affiche :

[object HTMLTableCellElement]

C'est pour cela que j'avais utilisé inner.HTML pour récupérer les valeurs des cellules.

Mon script JS :

function check(radio) {
		for (var j=0; j<radio.length;j++) {
			if (radio[j].checked) {

// j prend pour valeur la ligne cochée
				
// on cherche alors les informations contenu par les cellules de la ligne cochée, les cellules sont nommées tels que (numero de ligne, numero de colonne) dans la première table.

				var prenom = document.getElementById(j+",0");
				var nom = document.getElementById(j+",1");
				var ident = document.getElementById(j+",2");
				var serv = document.getElementById(j+",3");

// Ici, on n'obtient [object HTMLTableCellElement] à la place des informations, ce qui fonctionne avec inner.HTML
				
				var newRow = document.getElementById('masecondetable').insertRow(-1);
				
				var newCell = newRow.insertCell(0);
				newCell.innerHTML = prenom+" "+nom+" - "+ident+", "+serv;
			}
		}
	}

Modifié par Zetura (04 Jul 2008 - 09:18)