Remplir un select par un autre select
Bonjour la communauté,
Voilà j'ai deux liste de choix qui sont remplis à partir des requêtes MySQL et ce que je veux faire doit être simple pour ceux qui s'y connaissent bien en jquery et ajax.
Voici le code de mon premier select et du deuxième :
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
| <?php
// Connexion à la base de données
require('../scripts/php/connexion_db.php');
$sql=$connexion->query("SELECT * FROM cycles_scolaires");
if(!$sql){
$erreursql="<div class='row'><div class='col-md-12 alert-danger'><h4 class='alert-danger'>Une erreur s'est produite lors de la sélection des niveaux scolaires! Veuillez informer l'administrateur de l'application (" . $connexion->errno . ") " . $connexion->error."</h4></div></div>";
} ?>
<div class="row">
<form name="formenrmatc" method="GET" action="">
<fieldset><legend>Remplissez les champs suivants</legend>
<div class="col-sm-12 col-md-12 col-lg-12 form-group has-feedback">
<div class="col-sm-2 col-md-2 col-lg-2">
<label for="nivo">Niveau scolaire</label>
<select name="nivo" id="nivo" class="form-control" onchange="rechargeSelect(<?php echo $repsql['id_cycle_scol']; ?>);">
<option value='0'>Sélectionnez</option><?php
while($repsql=$sql->fetch_assoc()){ ?>
<option value='<?php echo $repsql['id_cycle_scol']; ?>' <?php if(isset($nivo)){ if($nivo==$repsql['id_cycle_scol']){ echo"selected"; }else{ echo ""; } } ?>><?php echo $repsql['nom_cycle_scol']; ?></option><?php
} ?>
</select>
<?php if(isset($erreurnivo)) echo $erreurnivo; ?>
</div>
<div class="col-sm-3 col-md-3 col-lg-3">
<label for="classe">Classe</label>
<select name="classe" id="classe" class="form-control" size='1'>
<option value=0>-- Sélectionnez la classe --</option>
</select>
</div>
</div>
</fieldset>
</form>
</div> |
Ce que je veux lorsqu'on sélectionne un élément dans le premier select qu'on récupère la valeur contenu dans l'argument value et cette valeur sera utiliser dans une requête dont le résultat sera stocké dans le deuxième select et j'ai pensé à ce code js qui fera certainement rire certains vu que c'est un bricolage que j'ai fais!
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
| <script type="text/javascript">
function rechargeSelect(pId){
$.ajax({
type: "POST",
url:"rechargeselect.php",
dataType: 'html',
contentType: "application/x-www-form-urlencoded;charset=UTF-8",
beforeSend: function(xhr) {
xhr.overrideMimeType('text/html; charset=UTF-8');
},
success:function(data,textStatus){
$(function(){
$('#classe').html(data);
return false;
});
//on déclare le nouveau select
var listeclasse = $("<select id=\"classe\"></select>");
listeclasse.append(
$("<option value=\"0\">Choisissez votre classe</option>")
);
//on boucle pour avoir les classes dans les options
var puces = '';
for (var i in data) {
puces += '<option value="'+data[i].idNivo+'">' + data[i].classe + '</option>';
}
listeclasse.append(puces);
//on remplace le select nouvellement déclaré
$('#classe').replaceWith(listeclasse);
//return item.CodePostal;
},
error: function (xhr, ajaxOptions, thrownError){
jAlert("Erreur de traitement Ajax");
}
});
};
</script> |
Et voici le code du fichier rechargeselect.php
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <?php
if(isset($_POST["nivo"]) and !empty($_POST["nivo"])){
$nivo=htmlspecialchars($_POST["nivo"]);
}
else{
$nivo="<a>Erreur</a>";
}
$sqlcl=$connexion->query("SELECT * FROM classes_scolaires WHERE id_cycle_scol='".$nivo."'");
if(!$sqlcl){
$erreursqlcl="<div class='row'><div class='col-md-12 alert-danger'><h4 class='alert-danger'>Une erreur s'est produite lors de la sélection des classes correspondantes! Veuillez informer l'administrateur de l'application (" . $connexion->errno . ") " . $connexion->error."</h4></div></div>";
}else{
while($repcl=$sqlcl->fetch_assoc()){ ?>
<option value="<?php echo $repcl['id_classe_scol']; ?>"><?php echo $repcl['nom_classe_scol']; ?></option><?php
}
}
?> |
Merci d'avance pour vos réponses!
