[AJAX] Fonction ajax pourtant toute simple

**Wizard50** · 03/03/2010, 23h14

Bonjour,

Voilà j'ai une page HTML qui ressemble à sa :

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
 
<html>
<head>
	<link rel='stylesheet' type='text/css' href='styles.css'>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Super-Délégué</title>
</head>
<body>
<script type="text/javascript" src="fonction.js"></script>
<div id="main">
	<div class="top"></div>
	<div class="middle">
		<div id="main_menu"></div>
		<div id="submain">
			<table align="center">
				<tr>
					<td>
						<input name="Button1" type="button" value="Valider" onclick="displayPage('etape_1')">
					</td>
				</tr>
			</table>
		</div>
	</div>
	<div class="bottom"></div>		
</div>
</body>
</html>

Nous sommes bien d'accord que quand l'utilisateur clique sur le bouton "Valider", cela appelle la fonction displayPage() de fonction.js avec pour paramètre 'etape_1'.

Voici la fonction displayPage() de fonction.js :

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
 
	function displayPage(page)
	{
 
			requeteAjax = null;
			requeteAjax = new XMLHttpRequest();
			requeteAjax.open("POST","script/"+page+".php",true);
			requeteAjax.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");
			requeteAjax.send("etape="+page);
 
			requeteAjax.onReadyStateChange = function()
			{
				if(requeteAjax.readyState == 4 && requeteAjax.status == 200)
				$('submain').innerHTML = requeteAjax.responseText;
			}
	}

Là, c'est difficile de faire plus simple non ?
Cependant, dès que je clique sur le bouton "Valider", Firefox m'affiche :

Not Found

The requested URL /SUPER-DELEGUE/etape_1.php was not found on this server.

(Utilisant WAMP, /SUPER-DELEGUE/ correspond au dossier qui contient mon fichier index.html et fonction.js).
Pourtant, etape_1.php se situe bien dans le dossier /SUPER-DELEGUE/script/ ...

D'ailleurs j'ai essayé ( test débile mais qui paye ) d'écrire :

Code :

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

requeteAjax.open("POST","test22.php",true);

Bien évidemment, test22.php n'existe pas

Résultat :

Not Found

The requested URL /SUPER-DELEGUE/etape_1.php was not found on this server.

Soit je suis extrêmement fatigué, soit très bête ... On dirait que JavaScript garde en mémoire le chemin qu'avait etape_1.php hier ...

Une idée peut-être ?
Merci de toute réponse

**laurentg2003** · 03/03/2010, 23h25

bonsoir
si tu fait un simple alert(page);
aprés function displayPage(page)
ça te renvoie quoi?
et si tu mets un lien absolu?
ou alors /script/"+page+

**hornetbzz** · 04/03/2010, 00h23

C'est juste des idées en plein vol :

- je vois juste un beau répertoire "SUPER-DELEGUE". As-tu essayé d'adresser ta requête vers un fichier situé dans un repertoire mieux nommé, par exemple sans le tiret , source potentielle de problèmes ... ?

- as-tu bien mis le chemin complet dans:

Code :

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

requeteAjax.open("POST","script/"+page+".php",true);

- ne faudrait il pas un ";" à la fin de ton appel js ?

Code :

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

<input name="Button1" type="button" value="Valider" onclick="displayPage('etape_1');">

- as-tu essayé de procéder autrement :

Code :

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

<input id="etape_1" name="Button1" type="button" value="Valider" onclick="displayPage(this)">

et de récupérer ta valeur étape_1 en js, en disant par exemple :

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
function displayPage(oSelected)
	{
 var current_selection = oSelect.id;
if (current_selection == 'etape_1') {
var xhr_file = "tonchemincomplet/vers/etape_1.php";
}
if (xhr_file) {
			requeteAjax = null;
			requeteAjax = new XMLHttpRequest();
			requeteAjax.open("POST",xhr_file,true);
			requeteAjax.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=utf-8");
			requeteAjax.send("etape=envoi_test_bidon");
 
			requeteAjax.onReadyStateChange = function()
			{
				if(requeteAjax.readyState == 4 && requeteAjax.status == 200)
				$('submain').innerHTML = requeteAjax.responseText;
			}
	}
 
else {
   alert('xhr file non defini");
}

- est ce que tu es sûr (j'ai un petit doute) qu'on peut envoyer, même en POST des variables avec un underscore "_" dans ton "requeteAjax.send" ?

- as tu essayé juste d'envoyer une variable bidon ou même un texte fixe ?

Code :

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

requeteAjax.send("etape=test");

- as-tu essayé d'échapper ta variable ou d'en mettre une plus simple escape()

Code :

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

requeteAjax.send("etape="+escape(page));

- et bizarre, car tu envoies en post le nom du fichier que tu sollicites par ta requete ajax... euh ça sert à quoi ..?

**E.Bzz** · 04/03/2010, 11h27

Bonjour,
moi je vois surtout des erreurs au niveau du traitement de la réponse :

tu déclares le onreadystatechange alors que la requête est déjà envoyée : il faut le faire avant le send()
onreadystatechange et non onReadyStateChange

Ca n'explique pas le problème de chemin, mais va falloir corriger quand même

Sinon, as-tu essayé de taper ton url à problème directement dans la barre d'adresse (au lieu de l'appel via Ajax) ?
Quel résultat ?

A+

**laurentg2003** · 04/03/2010, 14h28

c'est clair et je l'ai pas vu

**Wizard50** · 04/03/2010, 18h00

Aaaaaaaah merci à vous.

J'ai effectué pas mal des modifications que vous m'avez proposé et il semble que en effet, le "requeteAjax.open()" ne prenne pas en compte les page avec un "_".
Je pense que c'est cela, même si j'ai aussi changé le répertoire " SUPER-DELEGUE" en "DELEGUE", et rajouté un ";" lorsque j'appelle la fonction "displayPage()".

Je vous remercie aussi pour la fonction onreadystatechange, j'étais fatigué hier soir, passablement énervé et de surcroit, c'est mon premier script en Ajax

Merci à vous tous

[AJAX] Fonction ajax pourtant toute simple

AJAX

Discussions similaires

Partager

Partager