Comment puis-je récupérer des données MySQL à l'aide de jQuery AJAX ?

Récupération de données depuis MySQL à l'aide de jQuery AJAX

L'amélioration de l'interactivité dans les applications Web nécessite un moyen robuste de communiquer avec le serveur sans actualiser la page entière . jQuery AJAX offre cette fonctionnalité en envoyant des requêtes asynchrones et en gérant les réponses du serveur. Dans ce cas, nous visons à récupérer des données d'une base de données MySQL.

L'extrait de code fourni dans list.php tente de récupérer des enregistrements à l'aide de jQuery AJAX, mais il ne fonctionne pas correctement. Pour résoudre ce problème, nous allons créer une version améliorée qui récupère avec succès les données de la table MySQL.

Code JavaScript :

<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>

Explication :

• La fonction document ready garantit que le code JavaScript s'exécute une fois que le DOM est entièrement chargé.
• Lorsque le bouton "afficher" est cliqué, une requête AJAX est initiée à l'aide de la fonction $.ajax().
• La requête est envoyée au script "Records.php" à l'aide la méthode GET.
• Nous nous attendons à recevoir des données HTML en réponse, indiquées par le paramètre dataType : "html".
• En cas de succès réponse (code d'état HTTP 200), la réponse est renseignée dans l'élément div "responsecontainer", affichant efficacement les données sur la page.

Code PHP :

Connexion :

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

• Cette rubrique établit la connexion MySQL et sélectionne la base de données "simple_ajax".

Requête et réponse :

$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>";

• La requête récupère tous les enregistrements du table "utilisateurs".
• Le résultat est itéré et les données de chaque ligne sont affichées dans un HTML table.

Conclusion :

En suivant ces étapes révisées, vous pouvez réussir à récupérer des données d'une base de données MySQL à l'aide de jQuery AJAX et à les remplir sur le frontend comme voulu. Cette approche permet des applications Web dynamiques et interactives sans avoir besoin de recharger une page complète.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!