Hello,
Je sais, je vais avoir des remarques du genre : sujet ultra traité, mais je viens de passer une demi journée à chercher sur le web et faire des tests, et j'en arrive à demander un peu d'aide.
Voila, j'utilise le principe décrit ici (http://siddh.developpez.com/articles/ajax/#LIV-A) pour créer un select via un autre, en passant par un fichier php pour la partie bdd, et XMLHttpRequest pour la partie javascript.
[code]
// Requette AJAX
function makeRequest(url,id_niveau,id_ecrire){
var http_request = false;
//créer une instance (un objet) de la classe désirée fonctionnant sur plusieurs navigateurs
if (window.XMLHttpRequest) { // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
http_request.overrideMimeType('text/xml');//un appel de fonction supplémentaire pour écraser l'en-tête envoyé par le serveur, juste au cas où il ne s'agit pas de text/xml, pour certaines versions de navigateurs Mozilla
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Abandon :( Impossible de créer une instance XMLHTTP');
return false;
}
http_request.onreadystatechange = function() { traitementReponse(http_request,id_ecrire); } //affectation fonction appelée qd on recevra la reponse
// lancement de la requete
http_request.open('POST', url, true);
//changer le type MIME de la requête pour envoyer des données avec la méthode POST , !!!! cette ligne doit etre absolument apres http_request.open('POST'....
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
obj=document.getElementById(id_niveau);
data="val_sel="+obj.value;
http_request.send(data);
}
function traitementReponse(http_request,id_ecrire) {
var affich="";
if (http_request.readyState == 4) {
if (http_request.status == 200) {
// cas avec reponse de PHP en mode texte:
//chargement des elements reçus dans la liste
var affich_list=http_request.responseText;
obj = document.getElementById(id_ecrire);
obj.innerHTML = affich_list;
}
else {
alert('Un probleme est survenu avec la requete.');
}
}
}
[/code]
Code PHP qui génére la liste N°2:
[code]
$query = sprintf("SELECT id, cp, ville FROM villes WHERE cp='%d' ORDER BY ville ASC",
mysql_real_escape_string($_POST[val_sel]));
$result_recherche=mysql_query($query) or die (mysql_error());
$num_rows = mysql_num_rows($result_recherche);
// construction de la liste deroulante
$aff=="";
$aff .= " Ville :
<select name='id_ville' id='id_ville' onChange=\"makeRequest2('RepVilles.php','id_ville','id_ville_multi')\" class=\"required\" >";
if ($num_rows == 0)
$aff .= "<option value=\"\">-- Code postal introuvable, veuillez modifier --</option>";
else
$aff .= "<option value=\"\">-- Choisissez --</option>";
while ($row=mysql_fetch_assoc($result_recherche)){
$aff.='<option value="'.$row["id"].'">'.$row["ville"].'</option>';
}
$aff .= "</select><br><br>";
// envoi reponse Php a Ajax
echo $aff;
[/code]
Ca fonctionne très bien lorsqu'on a un 1er niveau, mais moi je voudrai en créer un 2e, à partir du select généré juste avant :
-> Select 1 fixe -> select 2 généré en js -> select 3 généré en js
Le problème, c'est que pour le select 3, la valeur du post est vide. "obj=document.getElementById(id_niveau);" ne semble renvoyer aucune valeur à partir du select N°2
Merci pour votre aide, j'en ai vraiment besoin !