Bonjour,

j'ai une page contenant un tableau rempli automatiquement avec des valeurs ( nombre d'heure de travail pour chaque mois pendant les 12 mois) se trouvant dans ma base de données MySQL .
Cependant en passant vers l'année suivante ( à l'aide d'un bouton suivant) après traitement des nouvelles valeurs et insertion du nouveau tableau dans le DOM avec Ajax et du innerHTML, j'ai toujours le premier tableau, ce qui me faits deux tableaux
voici en gros ce à quoi ressemble le code :

code avance de cliquer sur le bouton suivant:

Code php : 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
<?php
$codeIdentPilote=$_GET['codeIdentPilote']; 
try
{
	$bdd = new PDO('mysql:host=localhost;dbname=basec3p', 'root', '');
}
catch(Exception $e)
{
	die('Erreur : '.$e->getMessage());
}
  //DEFINIR L'ID DE LANNEE (POUR TEST, VALEUR A RECUPEREE APRES)
 $annee=date("Y");
 //Differents traitement de recureration  des données à tremplir dans le tableau
 ................
 .............
 ..............
 ?>
 <!--bouton qui me permettent d'incerementer ou de decrementer la date-->
 <input id="precendante" type="button" value="precedante" align="left" onClick="go('precedente')">
<input id="suivante" type="button" value="suivante" align="right" onClick="go('suivante')">
 
<form action="actionEditerFichePilote.php" method="post">
	<fieldset>
		<div id="diveTable">
			<legend>Details fiche <strong><?php echo $prenomPilote; echo " "; echo $nomPilote; ?></strong></legend>
				<table>
					<caption align="center" ><h1><div id="laDate">2013</div><h1></caption>
					<tr>
						<th>Champs</th>
						<th>Janvier</th>
						<th>Fevrier</th>
						<th>Mars</th>
						<th>Avril</th>
						<th>Mai</th>
						<th>Juin</th>
						<th>Juillet</th>
						<th>Aout</th>
						<th>Septembre</th>
						<th>Octobre</th>
						<th>Novembre</th>
						<th>Decembre</th>
					</tr>
					<!--remplissage de la ligne Regime-->
					<tr>
						<td>Regime </td>
						....
					</tr>
					<!--remplissage de la ligne Equipe-->
					<tr>
						<td>Equipe </td>
						....
					</tr>
					<!--Remplissage des ligne domaines -->
					<tr>
						<td>Equipe </td>
						....
					</tr>
				</table>
			</div>
		</fieldset>
	</form>


le 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
<script type='text/javascript'>
	function getXhr(){
                var xhr = null; 
		if(window.XMLHttpRequest) // Firefox et autres
		   xhr = new XMLHttpRequest(); 
		else if(window.ActiveXObject){ // Internet Explorer 
		   try {
		      xhr = new ActiveXObject("Msxml2.XMLHTTP");
	           } catch (e) {
	              xhr = new ActiveXObject("Microsoft.XMLHTTP");
	            }
		}
		else { // XMLHttpRequest non supporté par le navigateur 
		   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
		   xhr = false; 
		} 
                return xhr;
	}
	/**
	* Méthode qui sera appelée sur le click du bouton
	*/
	function go(param){
		var xhr = getXhr();
		//RECEPTION DES DONNEES
		// On défini ce qu'on va faire quand on aura la réponse
		xhr.onreadystatechange = function(){
		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
			if(xhr.readyState == 4 && xhr.status == 200){
				leNouveauTab = xhr.responseText;
				// On se sert de innerHTML pour rajouter les options a la liste
				document.getElementById('diveTable').innerHTML = leNouveauTab;
			}
		}
		//ENVOI DES DONNEES AU SERVEUR
		// Ici on va voir comment faire du post
		xhr.open("POST","ajaxAfficheDetailFichPilote.php",true);
		// ne pas oublier ça pour le post
		xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		// ne pas oublier de poster les arguments
		var anneeEntier=+document.getElementById('laDate').innerHTML;
		alert(param);
		if(param=="suivante"){
			anneeEntier++;
		}
		if(param=="precedente"){
			anneeEntier--;
		}
		alert(anneeEntier);
		//domaine = sel.options[sel.selectedIndex].value;
		xhr.send("anneeEntier="+anneeEntier);
	}
</script>

et enfin voici à peu près à quoi ressemble ma page de traitement Ajax :


Code php : 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
<?php
if(isset($_POST['annee'])){
	try
	{
		$bdd = new PDO('mysql:host=localhost;dbname=basec3p', 'root', '');
	}
	catch(Exception $e)
	{
		die('Erreur : '.$e->getMessage());
	}
	//recuperation du nom du manager ( a faire plutard avec les sessions)
	$annee=$_POST['annee'];
	//Traitement de recuperation des donées appropriées correspondant la la nouvelle année
	// remplissage de ma table
?>
<table id="tableToggle">
	<caption align="center" ><div id="laDate"><h1><?php  echo $annee;?><h1></div></caption>
		<tr>
			<!--<th colspan="13">2013</th>-->
			<th>Pilotes</th>
			<th>Janvier</th>
			<th>Fevrier</th>
			<th>Mars</th>
			<th>Avril</th>
			<th>Mai</th>
			<th>Juin</th>
			<th>Juillet</th>
			<th>Aout</th>
			<th>Septembre</th>
			<th>Octobre</th>
			<th>Novembre</th>
			<th>Decembre</th>
		</tr>
		<?php
		//remlissage de mes cellule
		$bdd=NULL; //fermeture de la base
		?>	
	</table>

Merci d'avance de votre aide