Comment récuperer en JS une donnée d'un tableau PHP et l' insérer dans un input
Bonjour,
J'essaye de trouver une solution à mon problème mais je n'arrive pas:
Voir code en gras en bas, j'ai fais des tests avec //window.alert(elt.innerHTML); // alert(document.getElementsByTagName('table')[0].getElementsByTagName('tr')[1].cells[0].innerHTML);pour essayé de comprendre mais pas moyen, si vous pouviez m'aider. Merci
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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
| <html>
<meta charset="UTF-8">
<?php include '../config_sql/config.php';
$reponse = mysql_query("SELECT * FROM adherents");
?>
<head> <link rel="stylesheet" type="text/css" href="../css/index_Adherent.css"></head>
<body>
<div id="champs">
<label>Matricule<label/><input type="text" id="ida"/>
<label>Nom:<label/><input type="text" name="Nom"/>
</div>
<div id="global">
<h4>Recherche Adherents</h4>
<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Recherche par nom" title="Type in a name">
<table id="matable">
<tr>
<th>Matricule</th>
<th>Nom</th>
</tr>
<?php //On affiche les lignes du tableau une à une à l'aide d'une boucle
while($donnees = mysql_fetch_array($reponse))
{
?>
<tr class="style" onmouseover="setMouseOver(this);" onmouseout="setMouseOut(this);" onclick="fctClick(this);" >
<td class="ida" ><?php echo $donnees['id_adherent'];?></td>
<td class="no"><?php echo $donnees['Nom'];?></td>
</tr>
<?php
} //fin de la boucle, le tableau contient toute la BDD
?>
</table>
</div>
<script>
// code pour la recherche conextuelle
function myFunction() {
var input, filter, table, tr, td, i;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("matable");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[1];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
</script>
<script type="text/javascript">
function setMouseOver(elt) {elt.className = elt.className == 'style_click' ? 'style_click' : 'style_over';}
function setMouseOut(elt) {elt.className = elt.className == 'style_click' ? 'style_click' : 'style';
}
// je veux recuperer la valeur $donnees['id_adherent'] de la ligne dans <input type="text" id="ida"/> lorsque je selectionne une ligne quelconque
function fctClick(elt){
}
</script>
<style type="text/css">
.style {background-color:white;}
.style_over {background-color:#D58490;}
.style_click {background-color:blue;}
</style>
</body>
</html> |
J'ai tjrs le même pb dans mon script JS
Bonjour, merci pour PDO, je vais voir comment refaire par contre j'ai refais plein de tests mas sans succès
J'ai simplifié mon code pour une meilleur lecture, quand j’accède à ma page j'ai le résultat ci-dessous:
TEST
1 test1
2 test2
3 test3
quand je clic sur la première ligne rien ne se passe mais elt.style.backgroundColor="red" fonctionne pour la cellule
pour les autres lignes sa fait la même chose
Pouvez vous m'apporter vôtre aide, merci.
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
38
39
| <html>
<?php include 'config.php';
$reponse = mysql_query("SELECT * FROM adherents");
?>
<body>
<p id="p-contenu">TEST<p/>
<table>
<tr>
<?php //On affiche les lignes du tableau une à une à l'aide d'une boucle
while($donnees = mysql_fetch_array($reponse))
{
?>
<td id="id-adherent" onclick="fctClick(this);"><?php echo $donnees['id_adherent'];?></td>
<td id="nom" onclick="fctClick(this);"><?php echo $donnees['Nom'];?></td>
</tr>
<?php } ?>
</table>
<script>
function fctClick(elt){
//histoire de tester ma fonction
elt.style.backgroundColor="red";
//formule ne fonctionne pas
document.getElementById('p-contenu').value = elt.getElementsById('id-adherent')[0].innerHTML;
}
</script>
</body>
</html> |
