Menampilkan data dari MySql Dengan PHP dan DataTable

Banyak cara untuk menampilkan data yang ada dalam database. Salah satunya yaitu dengan menggunkan PHP dan library Datatable.
Keunggulan dari datatable ini yaitu mudah dalam penggunaanya, tidak membutuhkan kode yang panjang dan satu lagi GRAATISSSSSSSSSSSSSS........!.

Oke.. !
Untuk libarry nya anda dapat mendownload di link berikut : Download Lybrary DataTable.

1. Buat  database.
2. Buat Koneksi datatbase,
3. Buat Form untuk menampilkan data.


Berikut Kode lengkapnya.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Data Payment Point</title>
<link href="../css/csslabgis2.css" rel="stylesheet" type="text/css"/>

<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/jquery.dataTables.js"></script>

<script>
$(document).ready(function() {
    $('#contoh').dataTable(); // Menjalankan plugin DataTables pada id contoh. id contoh merupakan tabel yang kita gunakan untuk menampilkan data
});
</script>
</head>

<body background="../images/bg_biru.png" onload="initialize()">
<table border="0" width="90%" align="center" cellpadding="0" cellspacing="0" class="mainTable">
    <tr>
        <td colspan="2"><img src="../images/aetralogo1.jpg"  width="100%" height="200px"/></td>
    </tr>
    <tr>
        <td colspan="2" background="../images/bg_oren.png" style="padding-left:10px">
            <table border="0">
                <tr height="55px">
                    <td class="mainMenu"><a href="#">Home</a></td>
                    <td class="mainMenu"><a href="#">Profil</a></td>
                    <td class="mainMenuAktif"><a href="peta_all.php">Peta</a></td>
                    <td class="mainMenu"><a href="#">Data Payment Point</a></td>
                </tr>
            </table>        </td>
    </tr>
    <tr>
        <td>
            <table border="0" id="contoh" class="display">
                <thead>
                    <tr>
                        <th>No</th>
                        <th>Kode</th>
                        <th>Nama</th>
                        <th>Jenis</th>
                        <th>Alamat</th>
                        <th>Desa</th>
                        <th>Kecamatan</th>
                        <th>Status</th>
                    </tr>
                </thead>
                <tbody>
                    <?php
                        $no=1;
                        include "../koneksi/koneksi.php";
                    $strSql = mysql_query("SELECT kd_payment_point,Nama,kd_jenis,alamat,desa,kecamatan,status FROM tb_payment_point") or die ("Cek Query select" .mysql_error());
                        while($hasil_query=mysql_fetch_array($strSql)){
                    ?>
                <tr>
                    <td> <?php echo $no++ ?></td>
                    <td> <?php echo $hasil_query['kd_payment_point']; ?> </td>
                    <td> <?php echo $hasil_query['Nama']; ?> </td>
                    <td> <?php echo $hasil_query['kd_jenis']; ?> </td>
                    <td> <?php echo $hasil_query['alamat']; ?> </td>
                    <td> <?php echo $hasil_query['desa']; ?> </td>
                    <td> <?php echo $hasil_query['kecamatan']; ?> </td>
                    <td> <?php echo $hasil_query['status']; ?> </td>
                </tr>
                <?php } ?>  
                </tbody>
            </table>
        </td>
    </tr>
    <tr>
        <td colspan="2" background="../images/bg_oren.png" align="center">
            <p>@aetra-tangerang2014</p>        </td>
    </tr>
</table>
</body>
</html>




Untuk memodifikasi tampilanya anda dapat dengan mudah membuatnya di web nya Klik di sini




Comments

Popular Posts