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
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
| <?php
session_start();
?>
<html>
<head>
<title>Ajout dans le planning</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 a la selection jour
*/
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('heuredebut').innerHTML = leselect;
}
}
// Ici on va voir comment faire du post
xhr.open("POST","heuredebut.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 du jour
var sel = document.getElementById('Jour');
var idjour=sel.options[sel.selectedIndex].value;
xhr.send("idJour="+idjour);
}
/**
* Méthode qui sera appelée a la selection heure debut
*/
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('heurefin').innerHTML = leselect;
}
alert(leselect);
}
// Ici on va voir comment faire du post
xhr.open("POST","heurefinbon.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 du heuredebut
var sel2 = document.getElementById('heuredebut');
var iddebut=sel2.options[sel2.selectedIndex].value;
xhr.send("idDebut="+iddebut);
}
</script>
</head>
<body>
<center>
<form >
<fieldset style="width: 500px" style="height:800px"style="font-size:26">
<legend>Ajout dans le planning</legend>
<label>Jour : </label><br>
<select name='Jour' id='Jour' onchange='go()' size="2" style="font-size:18" style="width: 200px" >
<option value="lundi">Lundi </option>
<option value="mardi">Mardi </option>
<option value="mercredi">Mercredi </option>
<option value="jeudi">Jeudi </option>
<option value="vendredi">Vendredi </option>
<option value="samedi">Samedi </option>
<option value="dimanche">Dimanche </option>
</select> <br><br>
<label>Heure debut : (disponible selon jour)</label><br>
<div id='heuredebut' style='display:inline'>
<select id='heuredebut' size="10" style="font-size:18" style="width: 200px" >
<option value="0">Choisir un jour</option>
</select>
</div>
<br><br><label>Heure fin : (disponible selon heure debut)</label><br>
<div id='heurefin' style='display:inline'>
<select id='heurefin' size="10" style="font-size:18" style="width: 200px" >
<option value="0">Choisir une heure de debut</option>
</select>
</div>
<br><br>
<label>Activité : </label><br>
<select name='Activite' id='activite' size="2" style="font-size:18" style="width: 200px" >
<?php
mysql_connect("localhost","root","")
or die("Mysql connect error");
mysql_select_db("reservation");
$res = mysql_query("SELECT * FROM activite ")
or die ('Erreur sql!'.$res.'<br/>'.mysql_error());
while($row = mysql_fetch_assoc($res)){
echo "<option value='".$row["numero_activite"]."'>".$row["libelle_activite"]."</option>";
}
?>
</select> <br><br>
</form>
<form method="post" action="ajoutacti.php">
<input type="submit" value="Ajouter" name="ajouter" style="font-size:22">
<input type="button" value="Retour" name="retour" style="font-size:22">
</fieldset>
</form>
</center>
</body>
</html>
<?php
if (isset($_POST['ajouter'])) {
}
?> |
[AJAX] 3 listes deroulantes liées
Répondre avec citation
Partager