Wie kann ich MySQL-Daten mit jQuery AJAX abrufen?

Abrufen von Daten aus MySQL mit jQuery AJAX

Um die Interaktivität in Webanwendungen zu verbessern, ist eine robuste Möglichkeit zur Kommunikation mit dem Server erforderlich, ohne die gesamte Seite zu aktualisieren . jQuery AJAX bietet diese Funktion durch das Senden asynchroner Anfragen und die Verarbeitung von Antworten vom Server. In diesem Fall möchten wir Daten aus einer MySQL-Datenbank abrufen.

Das bereitgestellte Code-Snippet in list.php versucht, Datensätze mit jQuery AJAX abzurufen, funktioniert jedoch nicht ordnungsgemäß. Um dieses Problem zu beheben, erstellen wir eine verbesserte Version, die erfolgreich Daten aus der MySQL-Tabelle abruft.

JavaScript-Code:

<script type="text/javascript">
$(document).ready(function() {
  $("#display").click(function() {
    $.ajax({
      type: "GET",
      url: "Records.php", 
      dataType: "html", 
      success: function(response) {                    
          $("#responsecontainer").html(response); 
      }
    });
  });
});
</script>

Erklärung:

• Die Funktion „Dokument bereit“ stellt sicher, dass der JavaScript-Code ausgeführt wird, sobald das DOM vollständig ist geladen.
• Wenn auf die Schaltfläche „Anzeigen“ geklickt wird, wird eine AJAX-Anfrage mit der Funktion $.ajax() initiiert.
• Die Anfrage wird mit an das Skript „Records.php“ gesendet die GET-Methode.
• Wir erwarten als Antwort HTML-Daten, angegeben durch die Einstellung dataType: „html“.
• Bei einer erfolgreichen Antwort (HTTP-Statuscode 200), die Antwort wird in das Div-Element „responsecontainer“ eingefügt, wodurch die Daten effektiv auf der Seite angezeigt werden.

PHP-Code:

Verbindung:

<?php
$con=mysqli_connect("localhost","root","");
mysqli_select_db("simple_ajax",$con);

• Dieser Abschnitt stellt her stellt die MySQL-Verbindung her und wählt die Datenbank „simple_ajax“ aus.

Abfrage und Antwort:

$result=mysqli_query("select * from users",$con);
echo "<table border='1' >...";
while($data = mysqli_fetch_row($result)){ 
     // Display the fetched data in HTML table format 
}
echo "</table>";

• Die Abfrage ruft alle Datensätze aus der „ Benutzer"-Tabelle.
• Das Ergebnis wird iteriert und die Daten jeder Zeile werden in einem HTML angezeigt Tabelle.

Fazit:

Indem Sie diese überarbeiteten Schritte befolgen, können Sie mit jQuery AJAX erfolgreich Daten aus einer MySQL-Datenbank abrufen und diese im Frontend als auffüllen gewünscht. Dieser Ansatz ermöglicht dynamische und interaktive Webanwendungen, ohne dass komplette Seiten neu geladen werden müssen.

Das obige ist der detaillierte Inhalt vonWie kann ich MySQL-Daten mit jQuery AJAX abrufen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!