Dynamisches Menü mit weiterführender Abfrage


BIM-T

Mitglied
Hallo, ich hoffe ihr könnt mir bei meinem "kleinen" Problem weiterhelfen.

In meinem Projekt generiere ich mit Hilfe von Ajax ein dynamisches Menü auf Basis einer MySQL Abfrage.
PHP:
<nav class="main_building_select">
        <ul class="nav navbar-nav">
            <?php
                $query = "SELECT * FROM ifc_building_storey";
                $result = mysqli_query($connect, $query);
          
                while($row = mysqli_fetch_array($result))
                {
                echo '
                <li id="'.$row["GUID"].'"><a href="#" onclick="openNav2()">'.$row["Storey_Name"].'</a></li>';
                }
            ?>
        </ul>
    </nav>

Auf Basis dieses Menüs lass ich mir mit folgender Funktion und einem weiteren PHP-Skript die zugehörigen Untermenüpunkte in einem div ausgeben.
Javascript:
   $(document).ready(function(){

         function load_rooms(id)            // Stellt die "id" des ausgelesenen li-Elements dem php-Skript zur Verfügung.
         {
          $.ajax({
           url:"fetch_rooms.php",
           method:"POST",
           data:{id:id},
           success:function(data)
           {
            $('#Sidenav_02').html(data);            // Gibt an, wo er ausgelesene Inhalt angezeigt werden soll.
           }
          });
         }

         load_rooms();

         $('div#Sidenav_01 li').click(function(){           // Selektor Wenn in einem div mit der id: Sidenav_01 ein "li"- Objekt angeklickt wird,
                                                            // dann wird die Funktion ausgeführt.
             //alert('OK');
          var GUID = $(this).attr("id");            // Liest die id des Li-Elements aus und übergibt sie an die Funktion "function load_page_details(id)".
          load_rooms(GUID);
                                  
         });
        });

Hierbei werden über das PHP-Skript (fetch_rooms.php) die entsprechenden Links generiert und in den div geschrieben.
JETZT KOMMT MEIN PROBLEM:
Ich möchte die ID's dieser Links wiederum verwenden um eine weitere Ajax- Abfrage zu starten um mir Informationen in einem weiteren div anzeigen zu lassen.
Ich schaffe es jedoch nicht, dass die zweite Abfrage die IDs findet, da sie ja erzeugt wurden, jedoch nicht in meinem Skript vorhanden sind.
Hier noch die Zweite Abfrage:

Javascript:
$(document).ready(function(){
          
         function load_room_informations(id)            // Stellt die "id" des ausgelesenen li-Elements dem php-Skript zur Verfügung.
         {
          $.ajax({
           url:"fetch_room_informations.php",
           method:"POST",
           data:{id:id},
           success:function(data)   
           {
            $('#main2').html(data);            // Gibt an, wo er ausgelesene Inhalt angezeigt werden soll.
           }
          });
         }

         load_room_informations();

         $('div#Sidenav_02 li').click(function(){           // Selektor Wenn in einem div mit der id: Sidenav_01 ein "li"- Objekt angeklickt wird, 
                                                            // dann wird die Funktion ausgeführt.
             //alert('OK');
          var Info = $(this).attr("id");            // Liest die id des Li-Elements aus und übergibt sie an die Funktion "function load_page_details(id)".
          load_room_informations(Info);
              alert(Info);                        // Testausgabe der GUID.
         });
        });

Kann mir jemand sagen wie ich derlei Abfragen umsetzen kann?

Vielen Dank schon einmal.

Hab eben noch einmal Recherchiert, ich bräuchte so etwas wie einen reload für die zweite Abfrage. Habe es eben mit .ajaxComplete versucht, hier liefert mir der Alert die richtige ID, aber der Browser hängt sich auf.... :-( Gibt es so etwas in der Art?
 
Zuletzt bearbeitet: