Bonjour à tous,
J'ai déjà posé se poste sur le forum "ajax" mais on m'a dit que s'était plus un problème de javascript alors je le repose ici, j'espère que quelqu'un pourra m'aide.
Je débute actuellement en ajax et je me heurte à quelque problème. Je cherche grace à l'ajax à récupérer les donners de deux menu déroulant qui sont dans un formulaire pour récupérer un 3 ème résultat en fonction des deux choix précedent.
En faite de le menu deroulant 1 je choisis la gare de mon arriver,
dans le menu déroulant 2 je choisis la station où je vais,
en fonction des deux id récupérer je selectionne dans ma base de donner le prix correspondant.
Jusque la c'est simple et fesable en php MAIS je dois faire tout sa sens changer de page ni la rafréchir d'ou l'utilité d'Ajax.
Je déclanche alors l'évenement lorsque l'on clic sur le menu déroulant 1 ou 2.
J'arrive à récuperer les résultat de chaque menu deroulant mais pas à dire :
"si le menu déroulant1 à été selectionné je garde l'id1 trouver en memoir (id_arriver), puis lorsque je selectionne le menu déroulant2 je récupère l'id2 (id_destination) et je le compare à id_arriver pour resortir le prix.
Je suis pas sur d'avoir su expliquer correctement le problème mais jespère que si. Voici mon code il y a 2 fichier:
test2.php"<html>
<head>
<title>Tutoriel Ajax (XHTML + JavaScript + XML)</title>
<script type='text/javascript'>
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 supporté par le navigateur
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
xhr = false;
}
return xhr;
}
/**
* Méthode qui sera appelée sur le click du bouton
*/
function go(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('div_prix').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajax.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('arriver');
id_arriver = sel.options[sel.selectedIndex].value;
xhr.send("id_arriver="+id_arriver);
}
function go2(){
var xhr = getXhr();
// On défini ce qu'on va faire quand on aura la réponse
xhr.onreadystatechange = function(){
// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
// On se sert de innerHTML pour rajouter les options a la liste
document.getElementById('div_prix2').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajax.php",true);
// ne pas oublier ça pour le post
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
// ne pas oublier de poster les arguments
// ici, l'id de l'auteur
sel = document.getElementById('destination');
id_destination = sel.options[sel.selectedIndex].value;
xhr.send("id_destination="+id_destination);
}
</script>
</head>
<body>
<?php
$conbas=mysql_connect("localhost","root","");
mysql_select_db("abcis",$conbas);
?>
<form>
<fieldset style="width: 500px">
<table>
<tr>
<td>Gare/Aéroport d?arrivée </td>
<td>
<select name="arriver" id='arriver' onclick='go()'>
<option value='0'>---------- Choix de votre arriver -----------------</option>
<?php
$res = mysql_query("SELECT nom_arriver, id_arriver FROM arriver");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["id_arriver"]."'>".$row["nom_arriver"]."</option>";
}
?>
</select> </td>
</tr>
</table>
<!--<label>Prix</label>
<div id='div_prix' style='display:inline'></div>-->
<table>
<tr>
<td>Gare/Aéroport destination </td>
<td>
<select name="destination" id='destination' onclick='go2()'>
<option value='0'>---------- Choix de votre arriver -----------------</option>
<?php
$res = mysql_query("SELECT nom_destination, id_destination FROM destination");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["id_destination"]."'>".$row["nom_destination"]."</option>";
}
?>
</select> </td>
</tr>
</table>
<label>Prix</label>
<div id='div_prix2' style='display:inline'></div>
</fieldset>
</form>
</body>
</html>
"
ajax.php
"<?php
if(isset($_POST["id_arriver"])){
$conbas=mysql_connect("localhost","root","");
mysql_select_db("abcis",$conbas);
$lien_id_arriver = ($_POST["id_arriver"]);
}
else { if(isset($_POST["id_destination"])||isset($_POST["id_arriver"])){
$conbas=mysql_connect("localhost","root","");
mysql_select_db("abcis",$conbas);
$lien_id_destination = ($_POST["id_destination"]);
import_request_variables ("g", "lien_");
$sql = "SELECT id_prix, recup_id_destination, nom_prix, recup_id_arriver FROM prix WHERE recup_id_destination='$lien_id_destination' AND recup_id_arriver='$lien_id_arriver'";
$res=mysql_query($sql,$conbas);
$num=mysql_num_rows($res);
$enr = mysql_fetch_row($res);
echo"<input type='text' name='total' size='30' class='total' value=".$enr[2].">";
}
}
?>
"
Voila ou j'en suis, j'espère que quelqu'un pourra m'aider. Merci à tous