PHP & AJAX, Menampilkan Data Mysql menggunakan AJAX &JSON
Sebagian dari anda programmer PHP mungkin sudah biasa menampilkan data dari database mysql di website menggunakan fungsi2 bawaan php, tetapi bagaimana jika database yang akan di tampilkan tersebut berasal dari query-query berat yang membutuhkan loading tinggi, tentu nya harus ada aplikasi atau metode yang bekerja di belakang layar, sehingga pekerjaan tidak langsung dieksekusi disisi client
Berikut Tutorial Cara menampilkan data dari database mysql menggunakan PHP, AJAX & JSON
Bagi yang belum paham apa itu Ajax & JSON silahkan baca di sendiri disini (maklum ane praktisi bukan dosen,, hehe)
Pertama2 Buat Database & tabel,
pada kasus ini
nama database=blog_tes,
tabel=teman
Anggap data pada tabel teman ini diatas 5000 row,,,
Kemudian buat file connect.php untuk konfigurasi ke database mysql,
<?php
# koneksi ke db
$h = "localhost";
$u = "root";
$p = "";
$db = "blog_tes";
mysql_connect($h,$u,$p) or die('error : '.mysql_error());
mysql_select_db($db) or die('error : '.mysql_error());
?>
kemudian buat file utama nya, index.php,,
isi cooding dibawah pada index.php
<html>
<head>
<title>json + jquery</title>
<script type='text/javascript' src='jquery-1.4.js'></script>
<script type='text/javascript'>
function data_teman(no){
//alert(no);
$.ajax({
url:"proses_json.php",
type:"POST",
cache:false,
dataType:'json',
data:{n:no},
success: function(data){
$.each(data,function(key,val) {
$('#nama_'+val.id).text(val.nama);
$('#hobi_'+val.id).text(val.hoby);
}); // end each
}// end success
}); // end ajax
}
</script>
</head>
<body>
<h2>Data yang tampil dari proses JSON</h2>
<?php
include"connect.php";
$sql="select count(id_teman) from teman";
$query=mysql_query($sql) or die ($sql);
list($totdata)=mysql_fetch_row($query);
?>
<table width="200" border="1">
<tr>
<td>ID</td>
<td>Nama</td>
<td>Hobby</td>
</tr>
<?php for ($i=1;$i<=$totdata;$i++){?>
<tr>
<td><?php echo $i ?></td>
<td id="nama_<?php echo $i?>"> </td>
<td id="hobi_<?php echo $i?>"> </td>
</tr>
<script>
data_teman('<?php echo $i?>');
</script>
<?php } ?>
</table>
</body>
</html>
Pada script <script type='text/javascript' src='jquery-1.4.js'></script>,, jangan lupa sertakan file jquery-1.4.js satu folder dengan file index php
kemudian ini yg paling penting
disini file untuk mengeksekusi query adalah file proses_json.php
bikin file proses_json.php kemudian isi kode dibawah ini :
<?php
include"connect.php";
$sql="select id_teman as id,nama as nama, hobby as hoby from teman";
$res=mysql_query($sql) or die ($sql.' # '.mysql_error());
$result = array();
while($row=mysql_fetch_object($res)){
array_push($result, $row);
}
echo json_encode($result);
?>
save ke 3 file diatas dalam 1 folder
-index.php
-connect.php
-proses_json.php
Materi ini telah saya revisi, sebelum nya semoga bermanfaat, thanks for visit my blog : )
gagal
BalasHapusjangan lupa di include jquery nya
BalasHapusini ga ada jquerynya ?
BalasHapusada gan
BalasHapusscript type='text/javascript' src='jquery-1.4.js'
sama script dibawahnya kn jquery+ajax
mybettingbettings.com: YouTube - Videoodl.cc
BalasHapusVideoslots.com. All sites. No downloads. youtube to mp3 downloader Play Now. Live Chat. Mobile App. Android. Live Chat. Mobile App. Android. Live Chat. Mobile App.