[AJAX] Débutant en AJAX

Bonjour,

Je me suis lancé dans mon premier script AJAX, j'attends un simple reponseText à afficher sur ma page.php, mais ma page reste sur "loading", comme si le serveur n'envoyait jamais la réponse.

Comme je n'ai pas de message d'erreurs à la génération de ma page, je ne sais pas où chercher, j'ai relus toutes mes lignes et je n'ai pas détecter d'erreur d'inattention (même si je la sent bien venir :-° )

Voici donc mon code (ceci étant mon premier script AJAX, si vous voyez des choses à éviter je vous serai reconnaissant de me les signaler ! :) )

Mon arborescence:
./site
-connexion_db.php
./site/js
-liberation_creneau.js
-check_groupe_by_creneau.php

Mon appel html

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<script type="text/javascript" src="./js/liberation_creneau.js"></script>
...
 
<select id='jour_liberation' name='jour_liberation'>
   <option value="lundi">lundi</option>
   <option value="mardi">mardi</option>
</select>
 
<select id='creneau_liberation' name='creneau_liberation' onchange='request(readData);'>
   <option value="huitadix">8H-10H</option>
   <option value="dixadouze">10H-12H</option>
</select>
 
 
<li>
        <span id="loader" style="display: none;"><img src="./images/ajax-loader.gif" alt="loading" /></span>
	<span id="groupe_for_this_creneau"></span>
</li>

Mon fichier liberation_creneau.js

Code:

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
 
function getXMLHttpRequest() 
{
	var xhr = null;
 
	if (window.XMLHttpRequest || window.ActiveXObject) 
	{
		if (window.ActiveXObject) 
		{
			try 
			{
				xhr = new ActiveXObject("Msxml2.XMLHTTP");
			} catch(e) 
			{
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
		} 
		else 
			xhr = new XMLHttpRequest(); 
	} 
	else 
	{
		alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
		return null;
	}	
	return xhr;
}
 
function request(callback)
{
	var jour = document.getElementById("jour_liberation").value;
	var creneau = document.getElementById("creneau_liberation").value;
	var xhr = new getXMLHttpRequest();
 
	xhr.onreadystatechange = function()
	{
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))
		{
			callback(xhr.reponseText);
			document.getElementById("loader").style.display = "none";
		}
		else if (xhr.readyState < 4)
			document.getElementById("loader").style.display = "inline";
	}
 
	xhr.open("GET", "check_groupe_by_creneau.php?Jour=" + jour + "&Creneau=" + creneau, true);
	xhr.send(null);
}
 
function write_div(_text)
{
	var element = document.getElementById("groupe_for_this_creneau");
 
	if (element != null)
		element.innerHTML = _text;
}
 
function readData(Sdata)
{
	write_div('Le créneau sélectionné est actuellement occupé par le groupe:' + Sdata + '.');
}

Mon fichier de traitement: check_groupe_by_creneau.php:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
<?php
        $jour = htmlspecialchars($_GET['Jour']);
        $creneau = htmlspecialchars($_GET['Creneau']);
        
        include("connexion_db.php");
        $requete_groupe = $bdd->query("SELECT groupe 
                                                        FROM creneaux
                                                        WHERE jour='$jour' AND creneau='$creneau' AND attribution=1");
        $requete_groupe->execute();
        $donnees = $requete_groupe->fetch();
        $requete_groupe->closeCursor();
        if (!$donnees)
                echo "Aucun groupe sur ce créneau";
        else
                echo $donnees['groupe'];
?>

Merci d'avance !

EDIT:
Après avoir repéré des erreurs d'inatention j'ai édité le poste, et cette fois j'ai "Le créneau sélectionné est actuellement occupé par le groupe:undefined." et ce pour les deux cas, celui où il est censé trouvé un nom de groupe et celui où il est censé afficher "aucun groupe trouvé".

Code:

1 2 3 <select id='creneau_liberation' name='creneau_liberation' onchange='request(readData);'> <option value="huitadix">8H-10H</option> </select>
Si ton select n'a qu'une option, a quel moment le onchange peut-il être décleché ? :koi:

Il y a environ une dizaine d'options sur chaque select, cependant j'en ai mit qu'une sur le forum pour ne pas polluer le poste avec trop de code (suite à ta remarque j'en ai rajouté une supplémentaire dans chaque select) ;)

Mon problème est que Sdata contient "undefined" et pas la réponse (le echo) de la page de mon traitement php

EDIT J'ai trouvé ! Ce n'était pas reponseText mais responseText, je crois que je vais limiter le recopiage et opter pour le copié/collé, finalement ce n'est pas qu'une question de fainéantise :aie: