2016-09-12 213 views
0

我有一個下拉列表,我去DATABSE往裏面:選擇的項目 - 下拉列表 - SQL

<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> 

正如您所看到的,我再次檢索所選的項目。

讓我繼續。第一個列表是在這裏爲用戶選擇一個部門。爲此,我執行一個SQL請求。然後,我檢索選擇的項目。我把它放在jQuery的var(看我的代碼)。我希望填寫第一個下拉列表中選定項目的第二個下拉列表,因爲每個部門的「Code Postal(法國)」(或英文ZipCode)列表都將更改。

你能幫助我嗎?

+0

什麼問題?你不能填充第一個組合框?你不能得到選定的項目?你不能填充第二個組合框? – Natrium

+0

我想執行不同的SQL請求,但我不知道如何選擇該項目。 – McNavy

+0

您正在混合您的服務器端和客戶端技術。你不能直接從jquery運行SQL - 你需要做一個Ajax調用。 –

回答

0

您可以在解決方案波動中不使用ajax,但您必須同時執行兩個查詢,並在javascript中執行您的邏輯,而不是每次在選擇列表中進行更改時都執行新的sql查詢。

如果您有大量的結果,那麼最好使用ajax,而不是一次加載所有數據。

爲您的代碼的其餘幾條建議: *不要使用大寫的HTML標籤 *不要在一個文件中 多次到同一個mysql數據庫連接*儘量分開PHP,JavaScript和HTML/CSS代碼

<?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> 
相關問題