Ankündigung

Einklappen
Keine Ankündigung bisher.

Probleme mit dynamischen Menu mit Ajax und MySQL

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Probleme mit dynamischen Menu mit Ajax und MySQL

    Hallo, ich hoffe ihr könnt mir helfen, ich komme wirklich nicht weiter.
    In meinem aktuellen Projekt habe ich ein Ajax Skript, welches mir mittels PHP Abfrage Li - Einträge für ein Menü ausliest und in einem DIV anzeigt. Das funktioniert soweit super.
    Jetzt möchte ich die ausgelesenen IDs der "neuen" Li-Einträge verwenden um eine weitere Abfrage von Inhalten ermöglicht.
    Da diese jedoch nicht im DOM sind, kann ich diese IDs jedoch nicht auswählen.
    Nun meine Frage: Wie schaffe ich es diese Li - Einträge / deren IDs für ein weiteres Ajax-Skript zu nutzen?

    Das ist mein aktuelles Skript mit dem ich mir die Einträge auslese:
    Code:
    $(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').on('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_rooms(id)".
              load_rooms(GUID);
                  alert(GUID);                        // Testausgabe der GUID.
             });
            });
    und hier meine zugehörige PHP:

    PHP-Code:
    <?php 
    //fetch.php
    if(isset($_POST["id"]))
    {
     
    $connect mysqli_connect("localhost""root""XXXXXX""db");
     
    $query "SELECT * FROM ifc_space WHERE Rel_Storey_GUID = '".$_POST["id"]."'";
     
    $result mysqli_query($connect$query);
     
    $output '';
     while(
    $rows mysqli_fetch_array($result))
     {
      
    $output .= '
      <li id='
    .$rows["GUID"].'><a href="#">'.$rows["Space_Name"].'</a></li>';

         
    //<li id='.$row["GUID"].'><a href="#" onclick="openNav2()">'.$row["Storey_Name"].'</a></li>';
     
    }
     echo 
    $output;
    }else{

        echo 
    "Kein Geschoss ausgewählt";

    }
    ?>
    Wie kann ich die dynamisch erzeugten Li-IDs für eine weitere Ajax-Abfrage nutzen?
    Ich hoffe so sehr das ihr mir helfen könnt.

  • #2
    Indem Du den Event Handler erst dann an die Elemente bindest, nachdem Du sie mit
    Code:
    $('#Sidenav_02').html(data);
    eingefügt hast.

    HTML Inhalte per Ajax abzurufen ist m.E. eine schräge Kiste. Rufe die Daten als JSON ab und füge Sie mit Javascript in das Dokument ein.

    Eine andere Möglichkeit wäre: https://api.jquery.com/delegate/

    Kommentar


    • #3
      Zitat von kaminbausatz Beitrag anzeigen
      HTML Inhalte per Ajax abzurufen ist m.E. eine schräge Kiste. Rufe die Daten als JSON ab und füge Sie mit Javascript in das Dokument ein.
      genau.
      und lektüre zum event handling gibt es bei

      https://www.php.de/forum/webentwickl...58#post1567058

      Kommentar


      • #4
        Danke für die Antwort, wie könnte so ein json Abruf denn aussehen?

        Kommentar


        • #5
          Schaust du hier: https://classes.engineering.wustl.ed.../AJAX_and_JSON

          Kommentar


          • #6
            Zitat von BIM-T Beitrag anzeigen
            Danke für die Antwort, wie könnte so ein json Abruf denn aussehen?
            PHP-Code:
            $data = [
                
            'foo' => 1,
                
            'bar' => 2
            ];

            header('Content-Type: application/json');
            echo 
            json_encode($data); 
            Code:
            $.getJSON('https://example.com/api.php', function (data) {
                console.log('foo = ' + data.foo);
                console.log('bar = ' + data.bar);
            });

            Kommentar


            • #7
              Der PHP-Code aus #1 ist unsicher und birgt das Risiko einer SQL-Injection. Im Schlimmsten Fall löscht dir einer die Daten komplett und dann?

              Kommentar

              Lädt...
              X