Envoi requête Ajax/jQuery/Php en deuxième instance
Bonjour ,
Je me permets de vous contacter afin de m'aider à résoudre mon problème .
Je dois faire une arborescence de menu et sous menu ( Domaines -> Objectifs -> Attentes ) afin de faciliter le choix de ces dernières .
Voici mon code et je vous explique ce qui en ressort :
Formulaire :
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 48 49
| <select class="custom-select custom-select-md lg-3" name="eleves" id="eleves">
<option value="0">Sélectionner un élève</option>
<?php
$reponse = $bdd->query('SELECT * FROM eleves ORDER BY eleveCycle');
while ($donnees = $reponse->fetch())
{
?>
<option value="<?php echo $donnees['eleveNom']?>"> <?php echo $donnees['eleveNom'] . " " . $donnees['elevePrenom'] . " - " . "Cycle " . $donnees['eleveCycle'];?>
</option>
<?php };?>
</select>
</div>
<div class="form">
<select class="custom-select custom-select-md lg-3" name="domaines" id="domaines">
<option value="0">Sélectionner le domaine </option>
<?php
$reponse2 = $bdd->query('SELECT DISTINCT matieresID FROM attentes_fondamentales');
while ($donnees = $reponse2->fetch())
{
?>
<option value="<?php echo $donnees['matieresID']?>"> <?php echo $donnees['matieresID'];?></option>
<?php };
?>
</select>
<?php
$reponse->closeCursor();
$reponse2->closeCursor();?>
</div>
<div class="form">
<select class="custom-select custom-select-md lg-3" name="objectifs" id="objectifs">
<option value="0">Sélectionner l'Objectif</option>
</select>
</div>
<div class="form">
<select class="custom-select custom-select-md lg-3" name="attentes" id="attentes">
<option value="0">Sélectionner l'attente fondamentale</option>
</select>
</div> |
Partie Script :
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
| <script>
$(document).ready(function(){
$('#objectifs').hide();
$('#attentes').hide();
$('#domaines').change(function(){
var domaines = $(this).val();
$('#objectifs').show();
console.log(domaines);
$.ajax({
url:"load_data.php",
dataType: "json",
method:"GET",
data:{domaines:domaines},
success:function(data){
console.log(data);
$('#objectifs').html(data);
}
});
});
$('#objectifs').change(function(){
var objectifs = $(this).val();
$('#attentes').show();
console.log(objectifs);
$.ajax({
url:"load_data2.php",
dataType: "json",
method:"GET",
data:{objectifs:objectifs},
success:function(data){
$('#attentes').html(data);
}
});
});
});
</script> |
1er Ajax :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
| <?php
include 'bsd.php';
if (isset($_GET['domaines']))
{
$domaines = $_GET['domaines'];
$req = $bdd->query("SELECT DISTINCT Objectifs FROM attentes_fondamentales WHERE matieresID = '$domaines'");
$options="";
while($donnees = $req->fetch())
{
$options.='<option value=' . $donnees["Objectifs"] .'>'. $donnees["Objectifs"].'</option>';
}
header('Content-Type: application/json;charset=utf-8');
echo json_encode($options);
$req->closeCursor();
}
?> |
2eme Ajax :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
| <?php
include 'bsd.php';
if (isset($_GET['objectifs']))
{
$objectifs = $_GET['objectifs'];
$req = $bdd->query("SELECT attentesNom FROM attentes_fondamentales WHERE Objectifs = '$objectifs'");
$options="";
while($donnees = $req->fetch())
{
$options.='<option value=' . $donnees["attentesNom"] .'>'. $donnees["attentesNom"].'</option>';
}
header('Content-Type: application/json;charset=utf-8');
echo json_encode($options);
$req->closeCursor();
}
?> |
Voici maintenant ce qui se passe :
- Le premier retour Ajax fonctionne parfaitement , il me renvoie dans le menu les bons termes , et les bonnes options value dans la console .
- Le deuxième en revanche ne fonctionne pas , cela me laisse un sous menu vide .
En regardant dans la console , le console.log me ressort que le premier mot de la phrase qui doit être comparé avec la BDD . Du coup , la requête fait dans la deuxième req Ajax ne peut pas fonctionner .
En regardant dans l'onglet réseau , je vois la requête GET fonctionner mais elle ne prend que le premier mot .
En faisant des tests en créant une attente qui ne se compare qu'avec le premier mot ( et non la phrase ) , la requête fonctionne car cela remplit le dernier champ .
Je ne sais pas si j'ai été clair tout du long , mais je galère et j'aimerais vraiment de l'aide :) .
Merci d'avance pour votre implication !