Discussion :

[supcomingenieur]

Bonjour,
j'ai une page web qui contient trois liens (lien1, lien2 et lien3) et un div "graphs" avec un scrolling vertical.

j'ai écrit une fonctions JS qui me permet, en cliquant sur n'importe quel lien de ma page, d'afficher mes graphes dans le div "graphs". De cette manière seul le div est chargé et non pas la page html entière.

Supposons que je clique sur l'un des liens, j'ai mes graphes qui s'affichent avec un bouton en dessous. J'ai voulu appliquer la même fonction JS sur ce bouton en appelons le même div "graphs" mais le problème est que j'ai l'impression que le div ne se charge pas mais il est appelé encore une fois et la preuve est que j'ai deux barre de scrolling.

Je ne sais pas comment faire.
Merci d'avance

[Bovino]

Modifie ton code et ça ira mieux je pense...

[JérémieL]

Bonjour,

Sans boule de cristal nous allons avoir du mal à savoir ce que tu fais exactement. Montre ton code, et si possible, un lien vers la page en question hébergée en ligne, pour que nous puissions t'aider.

Bovino :

[supcomingenieur]

rebonjour,
j'ai un peu changé le code, au lieu de recharger tout le div, j'ai choisi de charger uniquement les données sur les graphes.
j'utilise pour ce faire la bibliothèque JQCHART.
j'ai ce bout de code qui permet de changer les données du graphes une fois je clique sur un bouton. j'ai pourtant remarqué que losque je clique une fois, tout va très bien les donnees sur les axes x et y changent.
mais quand je clique une dexième fois (pour retourner en arrière), il est vrai qu'un rechargement des données s'effectue mais j'ai deux axes x qui aparairaissent.
Je sais pas d'ou vient le problème.

voila le code:

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
 
 $('#button1').click(function () {
 
               if (document.myform.button1.value == "Traffic distribution/Destination AS") {
               // renommner le bouton
              document.myform.button1.value="Traffic distribution/Source AS";
              // 4eme graphe
                var series4 = $('#jqChart4').jqChart('option', 'series');
                 var newaxes4 = { 
                   type: 'category',
                 location: 'bottom',
                 categories: [<?php echo $categories_d ?>],
                 zoomEnabled: true,
                 labels: {
                      font: '13px sans-serif',
                      fillStyle: '#eeeeee',
                      angle: -45
                          },
                 resolveOverlappingMode: 'hide',
                };           
                var axes4 = $('#jqChart4').jqChart('option', 'axes');
                var newSeries4 = {
                    title:'Today statistics',
                    type: 'column',
                    fillStyle: 'gray',
                    data: [<?php echo $today_data; ?>],
                };    
                 series4.splice(series4.length - 1, 1);
                 series4.push(newSeries4);
                 axes4.splice(series4.length - 1, 1);
                 axes4.push(newaxes4);
                 $('#jqChart4').jqChart('update');
              }
              else {
               document.myform.button1.value = "Traffic distribution/Destination AS";
               // 4eme graphe
                var series4 = $('#jqChart4').jqChart('option', 'series');
                var axes4 = $('#jqChart4').jqChart('option', 'axes');
                var newSeries4 = {
                    title:'This week statistics',
                    type: 'column',
                    fillStyle: '#9932CC',
                    data: [<?php echo $week_data; ?>],
                };
                var newaxes4 = { 
                   type: 'category',
                 location: 'bottom',
                 categories: [<?php echo $categories_w ?>],
                 zoomEnabled: true,
                 labels: {
                      font: '13px sans-serif',
                      fillStyle: '#eeeeee',
                      angle: -45
                          },
                 resolveOverlappingMode: 'hide',
                };               
                 series4.splice(series4.length - 1, 1);
                 series4.push(newSeries4);
                 axes4.splice(series4.length - 1, 1);
                 axes4.push(newaxes4);
                 $('#jqChart4').jqChart('update');
            }
            });

merci