Pertama kita membuat database untuk database udah saya buatkan tinggla download aja .
Mebuat koneksi database untuk coding saya nama kan config.php
<?php
$koneksi=mysql_connect("localhost","root","1"); // koneksi ke server
$db=mysql_select_db("cr"); // memilih database yang akan digunakan
?>
Mebuat form pencarian untuk coding saya nama kan form_cari.php
<!-- include file koneksi.php -->
<?php include "config.php";?>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>[Tutorial_Koding]_pencarian_data_Jquery-Ajax-PHP</title>
<!-- menginclude file jquery.min.js -->
<script src="jquery-1.6.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
<!-- event textbox keyup
$("#txtcari").keyup(function() {
var strcari = $("#txtcari").val(); <!-- mendapatkan nilai dari textbox -->
if (strcari != "") <!-- jika value strcari tidak kosong-->
{
$("#hasil").html("<img src='loading.gif'/>") <!-- menampilkan animasi loading -->
<!-- request data ke cari.php lalu menampilkan ke <div id="hasil"></div> -->
$.ajax({
type:"post",
url:"cari.php",
data:"q="+ strcari,
success: function(data){
$("#hasil").html(data);
}
});
}
});
});
</script>
<div>Cari Data : <input type="text" name="textcari" id="txtcari" /></div>
<div id="hasil"></div>
</body>
</html>
Mebuat form pencarian untuk coding saya nama kan cari.php
<?php
include "config.php";
$q=$_POST['q'];
// query untuk melakukan pencarian
$query=mysql_query("select * from mhs where nama like '%".$q."%'");
// mendapatkan jumlah baris
$row=mysql_num_rows($query);
if ($row > 0) // jika baris lebih dari 0 / data ditemukan
{
while ($data=mysql_fetch_array($query)) // perulangna untuk menampilkan data
{
// menampilkan data dalam bentuk table
echo "<table width='500'>
<tr>
<td>NPM</td>
<td>Nama</td>
<td>Jurusan</td>
<td>Alamat</td>
</tr>
<tr>
<td>".$data['npm']."</td>
<td>".$data['nama']."</td>
<td>".$data['jurusan']."</td>
<td>".$data['alamat']."</td>
</tr>
</table>";
}
}
else // jika data tidak ditemukan
{
echo "<strong>Data tidak ditemukan</strong>";
}
?>
Hasilnya sebagai berikut
No comments :
Post a Comment