Bagaimanakah Saya Boleh Dapatkan Data MySQL Menggunakan jQuery AJAX?

Mengambil Data daripada MySQL Menggunakan jQuery AJAX

Meningkatkan interaktiviti dalam aplikasi web memerlukan cara yang mantap untuk berkomunikasi dengan pelayan tanpa memuat semula keseluruhan halaman . jQuery AJAX menawarkan keupayaan ini dengan menghantar permintaan tak segerak dan mengendalikan respons daripada pelayan. Dalam keadaan ini, kami berhasrat untuk mendapatkan semula data daripada pangkalan data MySQL.

Coretan kod yang disediakan dalam list.php cuba mendapatkan semula rekod menggunakan jQuery AJAX, tetapi ia gagal berfungsi dengan betul. Untuk menangani perkara ini, kami akan mencipta versi yang dipertingkatkan yang berjaya mendapatkan semula data daripada jadual MySQL.

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

Penjelasan:

• Fungsi sedia dokumen memastikan kod JavaScript dilaksanakan sebaik sahaja DOM dimuatkan sepenuhnya.
• Apabila butang "paparan" diklik, permintaan AJAX dimulakan menggunakan fungsi $.ajax().
• Permintaan dihantar ke skrip "Records.php" menggunakan kaedah GET.
• Kami menjangkakan untuk menerima data HTML sebagai tindak balas, dilambangkan dengan dataType: "html" tetapan.
• Pada respons yang berjaya (kod status HTTP 200), respons diisikan ke dalam elemen div "responsecontainer", memaparkan data pada halaman dengan berkesan.

PHP Kod:

Sambungan:

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

• Bahagian ini mewujudkan sambungan MySQL dan memilih pangkalan data "simple_ajax".

Pertanyaan dan Respons:

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

• Pertanyaan mendapatkan semula semua rekod daripada jadual "pengguna".
• Hasilnya diulang dan setiap data baris dipaparkan dalam HTML jadual.

Kesimpulan:

Dengan mengikuti langkah-langkah yang disemak ini, anda boleh berjaya mendapatkan data daripada pangkalan data MySQL menggunakan jQuery AJAX dan mengisinya pada bahagian hadapan sebagai dikehendaki. Pendekatan ini membolehkan aplikasi web dinamik dan interaktif tanpa memerlukan muat semula halaman penuh.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Dapatkan Data MySQL Menggunakan jQuery AJAX?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!