Wie implementiert man automatisch wechselnde Optionen im zweiten Dropdown-Menü basierend auf der ersten Dropdown-Auswahl?

Automatische Änderung der Optionen im zweiten Dropdown-Menü basierend auf der ersten Dropdown-Auswahl

Beim Erstellen mehrerer Dropdown-Menüs mit den Optionen im zweiten Das Menü hängt von der im ersten Menü getroffenen Auswahl ab. Dies ist möglich, ohne auf eine Datenbank angewiesen zu sein.

Ersteinrichtung

Das erste Dropdown-Menü wird Zeigt eine Liste von Kategorien an, während im zweiten Dropdown-Menü Elemente angezeigt werden, die mit der ausgewählten Kategorie verknüpft sind.

Erstes Dropdown-Menü:

<select name="category"></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><option value="0">None</option>
<option value="1">First</option>
<option value="2">Second</option>
<option value="3">Third</option>
<option value="4">Fourth</option>

Nach dem Login kopieren

Zweite Dropdown-Liste:

<select name="items"><br></select><br>

Dynamische Optionen im zweiten Dropdown

Um die Optionen im zweiten Dropdown basierend auf der Auswahl im ersten Dropdown zu aktualisieren, benötigen wir eine AJAX-Funktion, die die ausgewählte Kategorie an ein PHP-Skript sendet.

AJAX-Funktion:

<script type="text/javascript"></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">function ajaxfunction(parent)
{
    $.ajax({
        url: 'process.php?parent=' + parent;
        success: function(data) {
            $("#sub").html(data);
        }
    });
}

Nach dem Login kopieren