Füllen Sie die Auswahlbox aus der Datenbankabfrage basierend auf einer anderen Auswahlbox mit nur 1 Tabelle

Hallo Leute Ich erstelle derzeit eine Website mit der Hauptfunktion der Buchung von Autos. Daher könnte der Benutzer zuerst eine Fahrzeugkategorie aus der Datenbankabfrage auswählen, die die ausgewählten Autokategoriennamen ausgibt. Nach der Auswahl des Autokategorie-Namens würde das zweite Auswahlfeld dann dynamisch mit einem neuen Satz von Autokennnamen aktualisiert, die der Kategorie zugeordnet sind.Füllen Sie die Auswahlbox aus der Datenbankabfrage basierend auf einer anderen Auswahlbox mit nur 1 Tabelle

Möglicherweise gab es viele ähnliche Fragen jedoch für die Website NO jQuery oder AJAX kann verwendet werden. Und andere Fragen und Beispiele verwenden oft 2 oder mehr Tabellen, aber ich verwende nur 1 Tabelle für diese Funktion.

Das folgende Beispiel soll zeigen, wie die Select-Box aktualisiert werden soll: Dynamically updated select box.

Die Tabelle verwendet wird, ist dies: Table Utilized

Meine Codes sind als solche:

<?php 
 
    session_start(); 
 
include "dbconn.php"; 
 

 

 
    $query = "SELECT carid, brand FROM cars"; 
 
    $result = $dbcnx->query($query); 
 

 
    while($row = $result->fetch_assoc()){ 
 
    $subcats[] = array("id" => $row['carid'], "val" => $row['brand']); 
 
    } 
 

 

 
    $jsonSubCats = json_encode($subcats); 
 

 

 
?> 
 

 
<!docytpe html> 
 
<html> 
 

 
    <head> 
 
    <script type='text/javascript'> 
 
     <?php 
 

 
     echo "var subcats = $jsonSubCats; \n"; 
 
     ?> 
 
     function loadCategories(){ 
 
     var select = document.getElementById("categoriesSelect"); 
 
     select.onchange = updateSubCats; 
 
     } 
 
     function updateSubCats(){ 
 
     var catSelect = this; 
 
     var catid = this.value; 
 
     var subcatSelect = document.getElementById("subcatsSelect"); 
 
     subcatSelect.options.length = 0; //delete all options if any present 
 
     for(var i = 0; i < subcats[catid].length; i++){ 
 
      subcatSelect.options[i] = new Option(subcats[catid][i].val,subcats[catid][i].id); 
 
     } 
 
     } 
 
    </script> 
 

 
    </head> 
 

 
    <body onload='loadCategories()'> 
 
      Car Category:<br /> 
 
     <select size="1" name="categoriesSelect" id="categoriesSelect"> 
 
      <option> Select Car Category </option> 
 
      <option value="sedan"> Sedan </option> 
 
      <option value="mpv"> MPV </option> 
 
      <option value="hatch"> Hatchback </option> 
 
     </select><br /><br /> 
 

 
     Car Brand:<br /> 
 
    <select id='subcatsSelect'> 
 
    </select> 
 
    </body> 
 
</html>

while($row = $result->fetch_assoc()){ 
$subcats[] = array("id" => $row['carid'], "val" => $row['brand']);

Wie ich aus kann nur der 3-Auto Kategorie MPV, Limousine und Fließheck richtig sehen die Abfrage erste Auswahlfeld:ich den Fehler auf die PHP-Anweisung möglicherweise identifiziert.

Derzeit erscheint der komplette KFZ-Markenname jedoch entsprechen die Ergebnisse nicht der der in der Datenbank ausgewählten Kategorie.

Vielen Dank.

Quelle

2016-10-26 Specs

Da beiden Arrays in PHP nach dem gleichen Muster folgen, wenn die JSON-Daten erstellt werden auch ähnlich sein damit das Verfahren der Daten zu durchlaufen soll, dass in loadCategories Funktion folgen - so vielleicht dies:

function updateSubCats(){ 
    var oSelect = document.getElementById("subcatsSelect"); 
    oSelect.options.length = 0; 

    for(var i in subcats){ 
     oSelect.options[ i ]=new Option(subcats[ i ].val, subcats[ i ].id); 
    } 
    }

Ohne Ajax zu verwenden oder Dinge mit komplexen Json-Iterationen zu komplizieren, könnten Sie diese Zeilen ausprobieren. Es sollte angemerkt werden, dass das Einbetten der $ _GET-Variable direkt in den SQL-Server nicht die beste Option ist - vorbereitete Anweisungen wären besser, sollten aber die Idee geben.

<?php 
    session_start(); 
    include "dbconn.php"; 
?> 

<!docytpe html> 
<html> 
    <head> 
    <title>Chained select</title> 
    <script type='text/javascript'> 

     function bindEvents(){ 
      document.getElementById('categories').addEventListener('change', getSubcategories, false); 
     } 

     function getSubcategories(e){ 
      var el=e.target ? e.target : e.srcElement; 
      var value=el.options[ el.options.selectedIndex ].value; 
      location.search='?category='+value; 
     } 

     document.addEventListener('DOMContentLoaded', bindEvents, false); 
    </script> 
    </head> 

    <body> 
    <form> 
     <select id='categories'> 
     <?php 

      $query = "SELECT carcat FROM cars"; 
      $result = $dbcnx->query($query); 

      while($row = $result->fetch_assoc()){ 
       echo "<option value='{$cat['carcat']}'>{$cat['carcat']}"; 
      } 

     ?> 
     </select> 
     <select id='subcategories'> 
      <?php 

       if(!empty($_GET['category'])){ 

        $sql = "SELECT carid, brand FROM cars where carcat='{$_GET['category']}';"; 
        $result = $dbcnx->query($sql); 

        if($result){ 
         while($row = $result->fetch_assoc()){ 
          echo "<option value='{$row['carid']}'>{$row['brand']}"; 
         } 
        } 
       } 

      ?> 
     </select> 
    </form> 
    </body> 
</html>

Quelle

2016-10-26 14:59:56 RamRaider

Ich aktualisiere nur meine Codes, so dass das Auswahlfeld für die Fahrzeugkategorie nur aus 3 statischen Werten bestehen würde. Der von Ihnen bereitgestellte Code ändert die Auswahlbox für die Automarken immer noch nicht dynamisch. Danke. – Specs

Ja Ich habe gerade die ID hinzugefügt, aber das Problem besteht immer noch. Momentan kann das "Marken" -Auswahlkästchen funktionieren, jedoch würde der gesamte Markenname erscheinen. Der Markenname sollte mit der Fahrzeugkategorie entsprechend der Datenbank angezeigt werden. Ich habe keine Ahnung, wo das Problem jetzt konzentriert ist. Vielen Dank. – Specs

Hi Ram Vielen Dank für die Erstellung der Codes. Es scheint jedoch, dass die Echowerte für die Optionen fehlerhaft sind. Wie Sie oben erwähnt haben, dass die GET_-Werte Probleme verursachen würden, scheint es, dass die Ergebnisse nicht korrekt angezeigt werden. Aber ich habe die Idee, die Werte direkt einzufügen. Vielen Dank. – Specs

Natürlich wird es nicht, werden Sie Ihren Arrays Zugriff falsch:

subcatSelect.options[i] = new Option(subcats[catid][i].val,subcats[catid][i].id); 
            ^^^^^       ^^^^^

Ihr subcats Array ist nur 2-dimensional, doch Sie es als 3-dimensionale Array Zugriff auf hier.

Quelle

2016-10-26 14:48:17

Sorry, ich verstehe nicht ganz, was Sie meinen. Können Sie mir bitte die richtige Anordnung zeigen? Vielleicht würde ich es verstehen, wenn ich es ansehe. Vielen Dank. – Specs

Ihr Subkatz-Array ist grundsätzlich '$ foo = array (array ('id' => 42))'. ein Array innerhalb eines anderen. Aber Ihre js behandelt es, als wäre es "Array (Array (ID => 42))" Es gibt keine 'Catid'-Dimension in diesem Array. –

Sorry, ich habe nur die Codes aktualisiert, damit das erste Auswahlfeld nur zulässt habe statische Werte, ich weiß, dass es die Abfrage für die zweite Automarke viel ändern würde Ich suche deine Geduld, weil ich mit jason Werten sehr neu bin. Danke. – Specs

Füllen Sie die Auswahlbox aus der Datenbankabfrage basierend auf einer anderen Auswahlbox mit nur 1 Tabelle

Antwort

Verwandte Themen