[AJAX] Ajax : faire "le tri" dans une réponse
bonsoir à tous !
D'abord pardonnez moi si je ne me suis pas présentez
je susi inscrit depuis quelque temps et je ne me rappel
pas avoir posté de presentation.
Je Mickael, jeune web master autodidacte en herbe, :oops:
même si j'ai pour habitude d'utiliser des CMS pour
"faire" mes sites dynamiques, ma créativités sans limite :mrgreen:
m’oblige souvent à "mettre les main dans le code".
Bien voici mon problème d'Ajax :
En fait j'ai réalisé un formulaire de soumission de lieu.
1ere étape : l'utilisateur sélectionne la catégorie du lieu (exemple : église, salle des fêtes...)
selon la réponse le script interroge la BDD par le biais de la page PHP qui renvoi la
réponse qui est ensuite insérée dans le sélecteur "pays" par le biais de getElem...innerHTML.
Jusqu'à là tout va bien, la liste des pays en fonction de la catégorie apparait bien dans le sélecteur "pays".
2eme étape : l'utilisateur sélectionne le pays pour afficher la liste des départements, et c'est là que ça coince car la liste des départements s'affiche bien, mais la liste des pays se tape l'incrust' dans le sélecteur... logique !!!
J'ai bien essayé tout un tas de structure conditionnelles mais rien y fait...
là je suis vraiment paumé... comment faire en sorte de "trier" les données réceptionnées ???
Faut il le faire au niveau de mon script JS ou au niveau de ma page PHP ?
Je précise que j’utilise la méthode GET.
Voici d'abord le code Javascript, si besoin je peu vous donner l’ensemble du code HTML et ou le code PHP de la page interrogée.
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
62
63
64
65
66
67
|
<script type="text/javascript">
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;
}
// 1. Mise en place du script Ajax (instance de l'objet xhr et suivie de la requete)
function request(callback) {
var xhr = getXMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
callback(xhr.responseText);
}
};
// 2. Définition des Variables
--> on recupere la valeur de la selection par le biais de document.getElementById, (Id = id du sélecteur)
var $catego = encodeURIComponent(document.getElementById("filtrecatego").value);
var $pay = encodeURIComponent(document.getElementById("filtrepay").value);
var $departement = encodeURIComponent(document.getElementById("filtredepartement").value);
var $ville = encodeURIComponent(document.getElementById("filtreville").value);
// 3. Requete au pres de "reponse_ajax.php" par le biais de GET (
xhr.open("GET", "rep_gmafp_ajax.php?catego=" + $catego + "&pay=" + $pay + "&departement=" + $departement + "&ville=" + $ville, true);
xhr.send(null);
}
// Option 1 : requete par le biais de "Categorie"
function read_from_catego(readpay) { // fonction activée par la selection d'une catégorie
document.getElementById("filtrepay").innerHTML = readpay;
// on insere la valeur HTML de la réponse dans l'ID par le biais de innerHTML.
}
function read_from_pay(readdep) { // fonction activée par la selection d'une catégorie
document.getElementById("filtredepartement").innerHTML = readdep;
// on insere la valeur HTML de la réponse dans l'ID par le biais de innerHTML.
}
</script> |
Merci d'avance pour votre aide !!
