[AJAX] Ajax fonctionnel sauf sur Wordpress
Bonjour à tous :)
Je me permets de vous poser une question concernant une requête AJAX. Avant de donner le code, quelques éléments pour mieux visualiser ce qui se passe :
Ici http://www.clementdussarps.fr/ajax/test.html , on peut cocher des cases dans la partie droite. Selon ce que vous cochez ou décochez, vous noterez qu'il y a des éléments indiqués à droite (par exemple "ICI AJAX : Valeur dpt : 94,96,97").
Ici, j'ai simplement récupéré le code HTML (un copier/coller de la page ! donc exactement le même code) que j'ai ici, fait via Wordpress : http://raudin.u-bordeaux3.fr/index-.php?cat=55
Hors, sur ce dernier lien (implémenté dans Wordpress donc), cela ne fonctionne pas ! Je ne comprends absolument pas d'où vient le problème.
Pour en savoir plus, voici la partie HTML du formulaire :
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
|
<form name="formulaire" method="post" action="#">
<table>
<tbody><tr>
<td>Action et Interaction</td>
<td><input name="tri_recherche[]" value="94" onclick="rechAv();" type="checkbox"></td>
</tr>
<tr>
<td>Atlas Numériques</td>
<td><input name="tri_recherche[]" value="95" onclick="rechAv();" type="checkbox"></td>
</tr>
<tr>
<td>Indicateurs et mesure</td>
<td><input name="tri_recherche[]" value="96" onclick="rechAv();" type="checkbox"></td>
</tr>
<tr>
<td>Agriculture et TIC</td>
<td><input name="tri_recherche[]" value="97" onclick="rechAv();" type="checkbox"></td>
</tr>
<tr>
<td>Territoire Numérique et Formation</td>
<td><input name="tri_recherche[]" value="98" onclick="rechAv();" type="checkbox"></td>
</tr>
</tbody></table>
</form> |
L'autre partie HTML où le PHP vient générer les chiffres :
Code:
1 2
|
ICI AJAX : <div id="resultatrechercheajax">Valeur dpt : 94,96,97</div> |
Et, enfin, le javascript :
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
|
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 supporte par le navigateur
alert("Conflit : navigateur ne supporte pas les objets XMLHTTPRequest");
xhr = false;
}
return xhr;
}
// Fonction a faire au clic sur les cases a cocher
function rechAv() {
var xhr = getXhr();
// On definit ce qu'on va faire quand on aura la reponse
xhr.onreadystatechange = function() {
// On ne fait quelque chose que si on a tout recu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200) {
leselect = xhr.responseText;
// On se sert de innerHTML pour identifier les elements envoyes
document.getElementById('resultatrechercheajax').innerHTML = leselect;
}
}
// POST (envoi des donnees)
xhr.open("POST","ajax-categorie.php",true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// Recuperation valeur checkbox
var criteres_recherche = new Array();
var nb = formulaire.elements['tri_recherche[]'].length;
for (i = 0; i < nb; i ++) {
if (formulaire.elements['tri_recherche[]'][i].checked) {
sel = formulaire.elements['tri_recherche[]'][i].value;
criteres_recherche.push(sel);
//alert(sel);
}
}
//Regroupe les resultats separes par des virgules
criteres_recherche = criteres_recherche.join(",");
//dpt = sel.options[sel.selectedIndex].value;
dpt = criteres_recherche;
xhr.send("valeurs_recherches="+dpt);
} |
Edit : j'ai oublié le PHP... que je n'ai pas à disposition ici, mais c'est un simple echo de la variable récupérée.
Si quelqu'un a une idée de pourquoi ça marche d'un côté, et pas de l'autre... je suis preneur de toute suggestion :)
Merci d'avance ! :)