Ajax Actualisation d'une DIV
Posté : 27 janv. 2012, 15:50
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
FunctionAjax.js
Voila si quelqu'un pouvais m'aidée parce que je galère un peu en JavaScript !
Merci d'avance pour l'aide
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
Code : Tout sélectionner
<!-- 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>Code : Tout sélectionner
<!-- Requête avec if en fonction du tri le tout mis dans un tableauCode : Tout sélectionner
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
