選択項目 - ドロップダウンリスト - SQL

Question

私はそれを埋めるためにdatabseに行く1つのドロップダウンリストがあります：あなたが見ることができるように、私はドロップダウンリストで選択した項目を取得

<TH> 
    <FORM> 
     <p>Département</p> 
     <SELECT size="1" id="depart" > 
      <OPTION> 
      <?php 
       try { 
        // Parametres connexion 
        $bdd = new PDO('mysql:host=localhost;dbname=db', 'root', '') or die ("Impossible de se connecter au serveur où est stocké la Base de Données."); 
        // Requête 
        $resultats = $bdd -> query("SELECT DISTINCT Departement                   FROM adresse                     ORDER BY Departement ASC"); 
        // Tant qu'il y a des enregistrements, remplir la liste déroulante 
        while($d = $resultats->fetch()) 
        { 
         echo '<option value="'.$d["Departement"].'">'.$d["Departement"].'</option><br/>'; 
        } 
       } 
       catch(PDOException $e){ 
        echo 'Erreur : ' . $e->getMessage(); 
       } 
      ?> 
      </OPTION> 
     </SELECT> 

     <!-- jQuery : Récupère le departement choisi --> 
     <script> 
      var departement_ = ''; 
      $('#departement').change(function departement() {departement_ = $('#departement option:selected').first().attr('value'); 

      // Display on input named "pu" 
      // $('#pu').val(depart_); 

      }); 
     </script> 
    </FORM> 
</TH> 

を：

<TH> 
    <FORM> 
    <p>Commune</p> 
    <SELECT size="1" id="commune" > 
     <OPTION> 
     <?php 
      try { 
       // Parametres connexion 
       $bdd = new PDO('mysql:host=localhost;dbname=db', 'root', '') or die ("Impossible de se connecter au serveur où est stocké la Base de Données."); 
       // Requête 
       $resultats = $bdd -> query("SELECT DISTINCT Commune                     FROM adresse                     WHERE Departement='AVEYRON'                      ORDER BY Commune ASC"); 
       // Tant qu'il y a des enregistrements, remplir la liste déroulante 
       while($d = $resultats->fetch()) 
       { 
        echo '<option value="'.$d["Commune"].'">'.$d["Commune"].'</option><br/>'; 
       } 
      } 
      catch(PDOException $e){ 
       echo 'Erreur : ' . $e->getMessage(); 
      } 
      ?> 
     </OPTION> 
    </SELECT> 

    <!-- jQuery : Récupère le code postal choisi --> 
    <script> 
    var commune_ = ''; 
    $('#commune').change(function commune() { 
      commune_ = $('#commune option:selected').first().attr('value'); 

      // Display on input named "pu" 
      // $('#pu').val(commune_); 

      }); 
    </script> 
</FORM> 

もう一度表示されているように、私は選択したアイテムを再確認します。

私は再開しましょう。最初のリストは、ユーザーのためのdepartementを選択するためのものです。このために、私はSQLリクエストを実行します。次に、選択したアイテムを取得します。私はjQueryのvarに入れました（私のコードを見てください）。そして、私は最初のドロップダウンで選択された項目の欄に2番目のドロップダウンリストを記入したいと思います。これは、各郵便局ごとに "フランスのコードポスタル"（または英語のZipCode）のリストが変更されるためです。

お願いします。

Answer 1

解決方法のようにajaxを使わずに行うことができますが、選択リストを変更するたびに新しいSQLクエリを実行するのではなく、両方のクエリを同時に実行してJavaScriptでロジックを実行する必要があります。

結果が大きい場合は、すべてのデータを一度にロードするよりも、ajaxを使用する方がよいでしょう。

あなたのコードの残りのための

いくつかの提案： * PHP、JavaScriptとHTML/CSSコード

を分離するようにしてください* 1つのファイル で同じMySQLデータベースに複数回接続しないでください* 大文字のHTMLタグを使用しないでください

<?php 
try { 
    // Parametres connexion 
    $bdd = new PDO('mysql:host=localhost;dbname=db', 'root', '') 
    or die ("Impossible de se connecter au serveur où est stocké la Base de Données."); 
    // Requête 
    $resultats = $bdd->query("SELECT DISTINCT Commune,Departement FROM adresse ORDER BY Commune ASC"); 
    // Tant qu'il y a des enregistrements, remplir la liste déroulante 
    $select_commune = ''; 
    while ($d = $resultats->fetch()) { 
     $select_commune .= '<option data-department="' . $d["Departement"] . '" value="' . $d["Commune"] . '">' . $d["Commune"] . '</option>'; 
    } 

    $resultats = $bdd->query("SELECT DISTINCT Departement FROM adresse ORDER BY Departement ASC"); 
    // Tant qu'il y a des enregistrements, remplir la liste déroulante 
    $select_depart = ''; 
    while ($d = $resultats->fetch()) { 
     $select_depart .= '<option value="' . $d["Departement"] . '">' . $d["Departement"] . '</option><br/>'; 
    } 
} catch (PDOException $e) { 
    echo 'Erreur : ' . $e->getMessage(); 
} 
?> 
<th> 
    <p>Département</p> 
    <select size="1" id="departement"> 
     <option value="">Choose department</option> 
     <?= $select_depart ?> 
    </select> 
</th> 
<th> 
    <p>Commune</p> 
    <select size="1" id="commune"> 
     <option value="">Choose Commune</option> 
     <?= $select_commune ?> 
    </select> 
</th> 

<script> 
    $(function() { 
     $('#commune option').hide(); 
     var departement_ = ''; 
     $('#departement').change(function departement() { 
      $('#commune option').hide(); 
      $('#commune option').first().show(); 
      departement_ = $('#departement option:selected').first().attr('value'); 
      $('#commune option[data-department="' + departement_ + '"]').show(); 
      // Display on input named "pu" 
      // $('#pu').val(depart_); 
     }); 
     var commune_ = ''; 
     $('#commune').change(function commune() { 
      commune_ = $('#commune option:selected').first().attr('value'); 

      // Display on input named "pu" 
      // $('#pu').val(commune_); 
     }); 
    }); 
</script>