Etrange JS et Ajax

**billyrose** · 30/06/2009, 09h15

bonjour a tous,

j'ai decouvert quelque chose d'etrange avec Ajax et Javascript. Voila j'ai un code brded.php tres simple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<?php
                echo '<select name="brule">';
                                echo '<option value=1>brule1</option>';
                                echo '<option value=2>brule2</option>';
                                echo '<option value=3>brule3</option>';
                                echo '<option value=4>brule4</option>';
                                echo '<option value=5>brule5</option>';
                echo '</select>';
        
 ?>

Ensuite j'ai mon code test.php ou se trouve le Javascript qui execute mon code brded.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
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
105
106
107
108
109
110
111
112
113
114
115
116
117
<script>
var bUniqueRowID = 0;
function getXhr(){
    var xhr = null; 
	if(window.XMLHttpRequest) // Firefox and others
		xhr = new XMLHttpRequest(); 
	else if(window.ActiveXObject){ // Internet Explorer 
	   try {
			xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
	}
	else { // XMLHttpRequest not supported by your browser
		alert(" Your browser does not support XMLHTTPRequest objects..."); 
		xhr = false; 
		} 
     return xhr
	}
 
	/**
	*  method called when the user clicks on the button
	*/
 
function gobr(){
	var xhr = getXhr()
	// We defined what we gonna do with the response
	xhr.onreadystatechange = function(){
	// We do somthing once the server's response is OK
	if(xhr.readyState == 4 && xhr.status == 200){
 
 
			// Retrieve <table> ID and create a <tbody> element
 
			// Retrieve <table> ID and create a <tbody> element
 
			var tbl = document.getElementById("brtable");
			var tblBody = document.createElement("tbody");
			var row = document.createElement("tr");
 
			bUniqueRowID += 1;
 
			var cell_1 = document.createElement("td");
			cell_1.align="center";
			cell_1.valign="center";
			var cell_2 = document.createElement("td");
			cell_2.align="center";
			cell_2.valign="center";
			var cell_3 = document.createElement("td");
			cell_3.align="center";
			cell_3.valign="center";
 
 
		// Create the first cell which is a select
 
			var cell1 = document.createElement("div");
			cell1.innerHTML=xhr.responseText;
			cell_1.appendChild(cell1);		
 
		//Create the second cell a checked box
			var cell2=document.createElement("input");
			cell2.type="checkbox";
			cell2.name="brdedicated";
			cell_2.appendChild(cell2);
 
		// Create the third cell which is a button
			var cell3=document.createElement("input");
			cell3.type="button";
			cell3.value="Delete"
			cell3.onclick=delRowbr;
			cell_3.appendChild(cell3);						
 
			// add cells to the row
			row.appendChild(cell_1);
			row.appendChild(cell_2);
			row.appendChild(cell_3);
 
		// add the row to the end of the table body
			tblBody.appendChild(row);
 
		// put the <tbody> in the <table>
			tbl.appendChild(tblBody);
 
		//	Rename cells with the row index			
			var ind=row.rowIndex;
			var liste_bname = row.getElementsByTagName("input");
			var selectname = row.getElementsByTagName("select");
			for(i=0; i < liste_bname.length; i++){
				if (/*(liste_bname[i].name == "brule")|| */ (liste_bname[i].name == "brdedicated")){
					liste_bname[i].name = liste_bname[i].name + "_" + ind; 
				}
			}
			selectname[0].name = selectname[0].name + "_" + ind;
 
 
			alert(ind);														
		// sets the border attribute of tbl to 2;
			tbl.setAttribute("border", "2");
 
		}
	}
	xhr.open("GET","brded.php",true);
	xhr.send(null);
}	
 
 
function delRowbr(){
	var i= this.parentNode.parentNode.rowIndex;
	document.getElementById('brtable').deleteRow(i);
}
</script>
<form method="post">
	<table align="center" border = "2" cellspacing ="0" cellpadding="3" id="brtable">
		<tr><td><b>Business Rule Type:</b></td> <td><b>Dedicated:</b></td><td><input type="button" Name= "Ajouterbr" Value="Ajouter BR" onclick="gobr()"></td></tr>
 
	</table>
</form>

Mais voila, quand j'ajoute une option comme cela dans le fichier brded.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

echo '<option value=6>brule6</option>';

et que je save le fichier brded.php et k j'actualise ma page test.php n'a toujours pas la derniere option que je viens d'ajouter.
pour que cette option apparaisse, il faut que je ferme cette page et que je relance localhost. et ainsi l'option 6 apparait.

Qu'en pensez vous? Est-ce normal ?
Merci d’avance.

Merci
Billy

**nod__** · 30/06/2009, 09h18

Aller, je prends pas trop de risques. Je parie que tu test sous IE?

( edit ) Ouais non en fait, j'ai lu trop vite.

**billyrose** · 30/06/2009, 09h22

Envoyé par nod__

Aller, je prends pas trop de risques. Je parie que tu test sous IE?

( edit ) Ouais non en fait, j'ai lu trop vite.

Vous avez raison. je teste sous IE

**SpaceFrog** · 30/06/2009, 09h23

http://www.innerhtml.saimal.fr/

dasn la partie retour tu crées déja au moyen du DOM les elements parents...
ne t'arretes pas en si bon chemin !

fais pluto generer un objet json à ta page php
sur le retour un simple eval et ensuite tu crées dynamiquement ton select

**gwyohm** · 30/06/2009, 09h24

C'est un phénomène de cache navigateur non ? Tu as essayé de passer un paramètre (qui change à chaque fois) à ta requete AJAX ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

xhr.open("GET","brded.php?dt=" + new Date().getTime(),true);

**SpaceFrog** · 30/06/2009, 09h26

le cache peut jouer aussi en effet
suffit de mettre un header no cache dans la page php ou comme proposé passer un timestamp lors du send

**le_chomeur** · 30/06/2009, 09h28

simple problème de cache ;-)

ajoute un pragma no cache dans ton fichier php

je te renvois ici : http://fr.php.net/manual/fr/function.header.php

**billyrose** · 30/06/2009, 09h32

merci a tous, je lis et teste vos propositions et ensuite je vous dis ce qu'il en est.

**billyrose** · 30/06/2009, 09h42

Envoyé par gwyohm

C'est un phénomène de cache navigateur non ? Tu as essayé de passer un paramètre (qui change à chaque fois) à ta requete AJAX ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

xhr.open("GET","brded.php?dt=" + new Date().getTime(),true);

Merci pour ta solution. j'ai meme pas besoin de reactualiser ma page.
Thanks

**billyrose** · 30/06/2009, 09h44

Envoyé par SpaceFrog

le cache peut jouer aussi en effet
suffit de mettre un header no cache dans la page php ou comme proposé passer un timestamp lors du send

Ca marche. Merci bcp

**billyrose** · 30/06/2009, 09h45

Envoyé par le_chomeur

simple problème de cache ;-)

ajoute un pragma no cache dans ton fichier php

je te renvois ici : http://fr.php.net/manual/fr/function.header.php

Merci pour le lien. pas besoin de reactualiser aussi.

Etrange JS et Ajax

JavaScript

Discussions similaires

Partager

Partager