Récupérer une donnée non affichée à l'écran

Version imprimable

Bonjour, j'ai un problème que je n'arrive pas à résoudre et sa me prend vraiment la tête:
j'ai essayé plein de sollution mais je n'arrive pas

Mon problème est que j'affiche un tableau avec JS, pas entièrement car je cache volontairement un colonne qui va occupé trop de place donc j'ai d&écidé de l'afficher dans un textarea séparément
lorsque je click sur une ligne du tableau, j arrive à récupérer ma donnée id_livre dans mon input idc1 alors que j'ai essayé par plusieurs moyens de faire la même chose pour resume dans idc3, impossible

Je vous remercie de votre aide

//ce qui me permetde recuper un tableau affiché dans ma page
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <tbody> <tbody> <tr onClick="fctClick(this);"> <td id="c1"><?php echo $donnees['id_livre'];?></td> <td id="c2"><?php echo $donnees['titre'];?></td> <td id="c3" style="display:none"><?php echo $donnees['resume'];?></td> </tr> </tbody> //fonction qui me permet de recuperer le contenu affiché à l'écran de la balise td (c1) dans mon champ text input function fctClick(elt){ var str = elt.innerText ; elt.textContent; var tab = new Array(); tab = str.split(" "); document.getElementById('idc1').value=tab[0]; document.getElementById('idc1').value=tab[2]; // je n'arrive pas à récuperer le contenu de cette } <input type="text" id="idc1"/> //ça fonctionne <textarea id="idc3"/> </textarea> //ça ne fonctionne pas

Bonjour,

Voici ce que je propose. Le code en php a été remplacé par du texte pour effectuer les tests.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
//fonction qui me permet de recuperer le contenu affiché à l'écran de la balise td (c1)  dans mon champ text input
 
function fctClick(){
  var str1 = document.getElementById('c1').innerText;
  var str2 = document.getElementById('c2').innerText;
  var str3 = document.getElementById('c3').innerText;
  document.getElementById('idc1').value=str1;
  document.getElementById('idc3').value=str3;
}
</script>
</head>
<body>   
 
<table border="1"> 
<tr onClick="fctClick();">
<td id="c1">donnee1</td>
<td id="c2">donnee2</td>
<td id="c3" style="display:none">donnee3</td>
</tr>
</table> 
 
<input type="text" id="idc1"/>
<textarea id="idc3"/> </textarea>
 
</body>
</html>

Bonjour, merci pour votre réponse
votre solution me convient très bien par contre j'ai un tableau de plusieurs lignes et quand je clic sur une autre ligne, mon script fctClick ne fonctionne plus, il récupère dans tous les cas que c3 de la première ligne ,je vous remercie pour votre aide.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
 
<script>
function fctClick(){
  var str1 = document.getElementById('c1').innerText;
  var str2 = document.getElementById('c2').innerText;
  var str3 = document.getElementById('c3').innerText;
  document.getElementById('idc1').value=str1;
  document.getElementById('idc3').value=str3;
}
</script>
 
<table id="matable">
   <tr id="lingne1">
           <td>Numéro</td>
           <td>Titre du livre</td>
   </tr>
	<?php
            while($donnees=$reponse->fetch())
            {
            ?>
 
     <tbody>    
	 <tr onClick="fctClick(this);"  >
 
			<td id="c1"><?php echo $donnees['Titre'];?></td>
			<td id="c2"><?php echo $donnees['ISBN'];?></td>
			<td id="c3" style="display:none"><?php echo $donnees['nom'];?></td>
	</tr>
      </tbody>         
 
            <?php
            }
           
            ?>
</table>
<input type="text" id="idc1"/>
<textarea id="idc3"/> </textarea>

02/01/2017, 16h29
eleydet

Rebonjour,

Chaque cellule du tableau doit avoir un identifiant unique. On récupère la valeur à l'aide de cet identifiant.
02/01/2017, 16h42
RBOUBRIT

Bonjour, c'est justement à ce niveau que je n'arrive pas à produire le code, mon tableau n'est pas static (nombre de lignes peut évoluer en + ou -) donc je ne peux pas à l'avance définir des id unique pour chaque le lignes.
merci
02/01/2017, 18h12
NoSmoking

Bonjour,

Citation:

Envoyé par eleydet

Chaque cellule du tableau doit avoir un identifiant unique.

on n'est nullement obligé de passer par des ID sur les éléments, dans le cas présent il suffit de récupérer les cellules, collection rows[i].cells, de lire les données, textContent, et de les affecter aux champs correspondants.

On en a déjà parlé dans cette discussion :
Cliquer sur une ligne de tableau créé depuis une base de données pour remplir un formulaire, une solution complète est proposée au post #8.
02/01/2017, 20h31
eleydet

Bonsoir,

Citation:

Selon NoSmoking
on n'est nullement obligé de passer par des ID sur les éléments, dans le cas présent il suffit de récupérer les cellules..

Il y a plusieurs solutions pour résoudre le problème. Passer par les ID est peut-être plus simple si la page comporte plusieurs tableaux. J'aurais peut-être dû écrire : Si on choisit d'attribuer à chaque cellule du tableau un identifiant, alors cet identifiant doit être unique.

Bonjour,
Je post la solution, merci à tous

exemple:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
function fctClick(obj){
 
var resume=obj.cells[1].textContent;
document.getElementById('resume').value=resume;
 
}
 
action sur le tr
<tr onclick="fctClick(this)">
	<td><?php echo $donnees['type_oeuvre'];?></td>
	        <td style="display:none"><?php echo $donnees['nom_editeur'];?></td>