Salut les professionnels
Alors voila je suis en train de développer un tableau de bord avec un affichage de donner sur une même page. C'est donné peuvent être trié par statues grâce à une liste déroulante utilisant AJAX. Ce que j'aimerai faire c'est que la DIV contenant le tableau de données soit actualisé toutes les 5 minutes mais en gardant le paramètre choisi dans la liste déroulante.
Donc voila un extrait simplifier du code :
Index.PHP
Get_Tableau.php
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 <!-- Ici une liste déroulante permettant de définir un critère de tri --> <div id="bandeau"> <table width=100%> <TR> <td width=33%> <form name="Classement" method="POST" > <fieldset> Choisir un type de classement : <select name="Lst_Classement" id="Lst_Classement" onchange="envoyerRequeteListeGet('Get_Tableau.php', this.value, 'tableau')" > <option value='-1'>Closed exclu</option> <option value='1'>Seulement New</option> <option value='2'>Seulement Inprog</option> <option value='3'>Seulement resolved</option> <option value='4'>Seulement Closed</option> </select> </fieldset> </form> </td> <td width=33%> <img id="dcns" src="DCNS.jpg" HEIGHT="50px" /> </td> <td> </td> </tr> </table> </div> <div id="tableau"> <!-- Ici est afficher le tableau avec les données --> </div>
FunctionAjax.js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2<!-- Requête avec if en fonction du tri le tout mis dans un tableau
Voila si quelqu'un pouvais m'aidée parce que je galère un peu en JavaScript !
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
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 function getreqHttp() { var reqHttp = null ; if(window.XMLHttpRequest) { // pour Firefox (Mozilla) et autres reqHttp = new XMLHttpRequest(); } else { if(window.ActiveXObject) { // pour Internet Explorer try { reqHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { reqHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } else { // XMLHttpRequest non supporté par le navigateur alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); reqHttp = false; } } return reqHttp; } // pour la methode POST function envoyerRequeteListePost(url , Classement, CodeId ) { // récupération d'un objet XMLHttpRequest var reqHttp = getreqHttp() ; if ( reqHttp == null) { alert("Impossible d'utiliser Ajax sur ce navigateur"); } else { // appel d'une fonction anonyme (définie à la volée) reqHttp.onreadystatechange = function() { // tester si tout s'est bien passé if (reqHttp.readyState == 4 && reqHttp.status == 200) { // tout est ok // le résultat est récupéré via la propriété responseText LesLivres = document.getElementById(CodeId); LesLivres.innerHTML = reqHttp.responseText; } } // ouverture de la connexion avec le serveur reqHttp.open("POST", url, true) ; // obligatoire pour la méthode post reqHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // recupération de l'objet correspondant à la catégorie selectionnée LesClassements = document.getElementById(Classement); //alert (LesClassements) ; CodeClassement = LesClassements.options[LesClassements.selectedIndex].value; // envoi de la requête reqHttp.send("CodeClassement=" + CodeClassement); //alert(CodeClassement) ; } return ; } // pour la méthode GET function envoyerRequeteListeGet(url, idClassement, CodeId) { //alert(idClassement + CodeId) ; // récupération d'un objet XMLHttpRequest var reqHttp = getreqHttp() ; if ( reqHttp == null) { alert("Impossible d'utiliser Ajax sur ce navigateur"); } else { // appel d'une fonction anonyme (définie à la volée) reqHttp.onreadystatechange = function() { // tester si tout s'est bien passé if (reqHttp.readyState == 4 && reqHttp.status == 200) { // la requête s'est correctement déroulée // le résultat est récupéré via la propriété responseText LesPdt = document.getElementById(CodeId) ; LesPdt.innerHTML= reqHttp.responseText; } } // ouverture de la connexion avec le serveur - méthode GET - asynchrone // escape permet de s'affranchir des problèmes liés aux caractères spéciaux //alert(idClassement) ; reqHttp.open("GET",url + "?CodeClassement=" + escape(idClassement), true); // envoi de la requête reqHttp.send(null); } return ;
Merci d'avance pour l'aide![]()
Partager