Bonjour, je sollicite votre aide car j'essaie de lier mes deux SELECT quartier et sousquartier. Je n'arrive pas à voir le problème, rien ne s'affiche dans la console.
C'est toujours les sousquartiers du 1er quartier qui s'affichent
Ma table quartiers est de la forme suivante:

id id_parent quartier_fr quartier_en
1 0 quartier1 quartier1
2 0 quartier2 quartier2
3 0 quartier3 quartier3
4 0 quartier4 quartier4
...
101 1 sous-quartier1 sous-quartier1
102 1 sous-quartier2 sous-quartier2
...
201 2 sous-quartier4 sous-quartier4
202 2 sous-quartier5 sous-quartier5
...

Voici le code dans la page formannonce.php (se trouvant dans le dossier principales):
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
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
<head>
       <meta charset="utf-8">
       <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
 
       <script src='/jquery-3.6.0.js'> </script>
 
       <script>
        $(document).ready(function(){
$('#quartier').on('change',function(){
var quartierID= $(this).val();
if(quartierID){
 $.getJSON("/principales/ajax.php",{quartier:quartierID}, function(result){
    console.log('reponse ajax',result);
    $.each(result, function(i, el){
      $("#sousquartier").append("<option value='"+el.id+"'>"+el.qua+"</option>");
      }); // ferme le each
    }); // ferme le getJson
  } // ferme le if
}); // ferme le on change
        });
</script>
//...suite 
//Pour les select:
<div id= "c">
 
             <span><label for="quartier"><?php echo $lang['quartier'];?></label></span> <br>
                <select id="quartier" onchange="choisirsous()" name="quartier">
                <option value="" disabled selected><?php echo $lang['quartier'];?></option>
              <?php
              
           // 1- on récupère les quartiers principaux
$quartiers = getQuartier( 0 );
$sousquartiers = getQuartier( $quartiers[0]['id'] );   
 
if($quartiers){
              foreach($quartiers as $quart){
 
 
 
 echo "<option value='".$quart['id']."'>".$quart['qua']."</option>";
 
   
 }
 ?>
 
</select>
<br> <br>
</div>
 
<div id="d">
 
<span><label for="sousquartier"><?php echo $lang['quartier'];?>2</label></span> <br>
                <select id= "sousquartier" name="sousquartier">
                <option value="" disabled selected><?php echo $lang['quartier'];?></option>
              <?php
              
           
 
              foreach($sousquartiers as $sq){
 
 
 
 echo "<option value='".$sq['id']."'>".$sq['qua']."</option>";
 
}
 
 
}//fin accolade if $quartiers
      
 ?>
 
</select>
 
</div>

Et d'autre part la page ajax.php dans le dossier principales:
Code php : Sélectionner tout - Visualiser dans une fenêtre à part
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
<?php
include "../cnx.php";
function getQuartier( $id_parent=0 )
{
   global $bdd;
 
   $sql_lang = (!empty(($_SESSION['lang']) && in_array($_SESSION['lang'], ['fr','en']) ))? $_SESSION['lang'] : 'fr'; // on s'assure que la langue est correcte
 
   $sql = "SELECT id, id_parent, quartier_".$sql_lang." AS qua
 FROM quartiers
 WHERE id_parent = :id_parent
 ORDER BY id
 ";
 
   try{
      $req = $bdd->prepare($sql);
      $req->execute( array(':id_parent'=>$id_parent) ); 
      $res =  $req->fetchAll(PDO::FETCH_ASSOC);
    }catch(Exception $e){
      echo "Erreur dans la requête " . $sql;
      $res = false;
    }
 
   return $res;
}
 
 
$q = !empty($_GET['quartier']) ? $_GET['quartier'] : NULL;
if(isset($q)){
    $sousquartiers = getQuartier( $q);   
    echo json_encode( $sousquartiers ) ;
   exit;
}
 
?>

Le fichier jquery-3.6.0 est dans aucun dossier, c'est pourquoi j'ai mis un / dans <script src=

Auriez-vous une solution?