Bonjour,

Je continue mon application (Gestion de livres) avec l'affichage de mes 2 tableaux sur la même page
  • le premier listant les titres de livres ( NumLiv, Titre, Année,...)
  • le second listant tous les chapitres du livre sélectionné dans le 1er tableau.

La sélection se fait donc en cliquant sur une ligne du 1er tableau (colorise la ligne) et doit donc mettre à jour le second tableau avec les infos récupérées en BDD.

Pour ce faire, j'ai un script (list-PILO) comprenant du J.S qui suite à l'évenement onclick sur une ligne du 1er tableau colorise cette dernière puis va récupérer le NumLiv (N° du livre affiché ds le 1er tableau) pour passer en paramètre cette info afin d'appeler le script listchap-JSON.php qui permettra de faire cette jointure avec l'autre table (CHAP)
(Par défaut, (au chargement de la page) j'ai mis dans mon code que la 1ère ligne (NumLiv=1) (Tab LIV) soit toujours sélectionnée et de ce fait, j'ai bien dans mon tableau (CHAP) l'affichage de la liste des chapitres
correspondants (tout ceci fonctionne bien...) )

mais là où il y a un problème (j'y arrive...;-)) ) c'est que si je clique sur une autre ligne (et quelque soit la ligne) , il m'affiche toujours les chapitres du NumLiv=1, c'est comme si

var numliv = $(this).find('#NumLiv').html(); était toujours égal à 1 (Et c'est bien le cas car en faisant un console.log(numliv) : c'est toujours égal à 1 )

Je vous ai joint que la partie JS (car à priori c'est à ce niveau que se situe le problème...???)
Rem: pour la suite du traitement, pas d'erreur particulière.
(au retour du JSON), j'ai bien les log affichés (mon tableau rempli (data) + "MAJ après tableau")

Je ne vois vraiment pas où se situe le problème ????
Merci d'avance pour vos remarques ou solutions ;-))

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
<script type="text/javascript">
 
/////     -------------------------------------------------------
/////   APPEL FONCTION lineClicked ( Affichage Tableau CHAP)
/////     -------------------------------------------------------
 
 
         function lineClicked(){
 
             $('.scrolldown tr').removeClass('lignecoloree lignenormale');
 
              $(this).addClass('lignecoloree');     // Rajoute la classe sur la ligne cliquee
           }
 
 
         $(document).ready(function(){
 
 
                 $('.scrolldown tbody').on('click','tr',lineClicked);
 
 
                 var numliv = $(this).find('#NumLiv').html();  // Récupére la valeur de la cellule
 
 
                 console.log("numliv "+numliv);
 
 
                  $.ajax({
                         type: 'POST',
                         url: 'listchap-JSON.php',
                         data: 'num=' +numliv,
                         datatype: 'json',
 
 
                         success:function(data){
 
		         console.log("ret data "+data); 
 
                          $.each(data.listchap, function(index,valeur){
                              $("#ligneschap").append("<tr>"    
                                                 +"<td>" +valeur.chapitre+ "</td>"
                                                 +"<td>" +valeur.avion+    "</td>"
                                                 +"<td>" +valeur.date+     "</td>"
                                                 +"<td>" +valeur.pays+     "</td>"
                                                 +"<td>" +valeur.cie+      "</td>"
                                                 +"<td>" +valeur.comment+  "</td>"
                                                 +"</tr>");
                         });
 
			 console.log("APRES MAJ TABLEAU");
 
                         },
 
 
                        error:function(data)
                         { 
                          console.log("ERROR");
                         }  
 
                    });
           });
 
 
      </script>