[AJAX] listes liées AJaX rappeler 2 fois dans le meme formulaire
Bonjour.
Après lecture de 2 tutos ici sur les listes liées ajax, je suis parvenu a en faire rouler une dans mon formulaire mais comme je dois la réutiliser une seconde fois dans ce meme formulaire, je me rends compte que j'ai des améliorations a faire sur mon javascript pour faire rouler la deuxième.
il s'agit en fait que je dois appeler les villes et provinces de départ pour une première fois et ensuite rappeler les mêmes villes et provinces pour l'arrivée.
Est-ce possible que quelqu'un puisse m'indiquer comment y parvenir?
en fait, dans le deuxième rappel , les provinces fonctionnent mais ce sont les villes qui ne fonctionnent pas
dans le 2e rappel, j'ai changé le nom de ma div <div id='villes2' mais rien ne change
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
| <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('villes').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","ajaxVilles.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 la province
sel = document.getElementById('provinces');
ProvinceID = sel.options[sel.selectedIndex].value;
xhr.send("province_id="+ProvinceID);
}
</script> |
voici le code pour le select 'villes2'
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| <p>Destination - Choisissez une province :
<select name="provinces2" id="provinces2">
<option value='-1'>Choisir</option>
<?php
mysql_connect("localhost","root","");
mysql_select_db("trajetel");
$res = mysql_query("SELECT * FROM provinces ORDER BY nom");
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["id"]."'>".$row["nom"]."</option>";
}
?>
</select>
<span id="loader2" style="display: none;"><img src="../images/loader.gif" alt="loading2" /></span>
</p>
</p>
<p> Choisisez une ville d'arrivée :
<div id='villes2' style='display:inline'>
<select name='villes2'>
<option value='-1'>Choisir une ville : </option>
</select>
</div> |
merci
