Membuat Form Bukutamu Keren Dinamis Tampil

Dunia Programming - Halo, jumpa lagi dengan saya dalam lanjutan tutorial pembuatan Form Bukutamu Keren menjadi dinamis, pada tutorial kali ini saya akan menjelaskan bagaimana cara membuat tampilan data yang sudah kita inputkan, yang nantinya bisa ditampilkan kepada pengguna dengan menggunakan PHP Native.

 

Membuat Form Bukutamu Keren Dinamis Tampil

Untuk fungsi dari menampilkan data itu sendiri adalah, agar si pengguna lebih mudah melihat data hasil yang di inputkan tanpa perlu kita melihat ke database mysqlnya.

dan cara ini terbilang cukup mudah, jika kalian pernah mempelajari SQL, kalian pasti faham bagaimana syntaxnya.

langsung saja kita masuk ke tutorialnya.

Menampilkan data buku tamu dengan menggunakan PHP Native

langkah pertama yang harus kalian lakukan adalah, membuka folder project yang dulu pernah kalian buat di tutorial pertama, kemudian buat file baru dengan nama tampil.php

setelah itu copy source code dibawah ini :

<link rel="stylesheet" type="text/css" href="style.css">
<table width="922" border="0" bordercolor="#003366" align="center">
 <tr>
  <td height="38" colspan="9">
   <img src="dh.png">
  </td>
 </tr>
 <tr>
  <td width="25" height="26" bgcolor="#CCCCCC"><div align="center">ID</div></td>
  <td width="202" bgcolor="#CCCCCC"><div align="center">Nama</div></td>
  <td width="70" bgcolor="#CCCCCC"><div align="center">Alamat</div></td>
  <td width="80" bgcolor="#CCCCCC"><div align="center">Email</div></td>
  <td width="115" bgcolor="#CCCCCC"><div align="center">Kota</div></td>
  <td width="152" bgcolor="#CCCCCC"><div align="center">Pesan</div></td>
  <td colspan="2" bgcolor="#808080"><div align="center">Option</div></td>
 </tr>

 <?php
  include "koneksi.php";
  $qry = mysqli_query($koneksi, "SELECT * FROM t_tamu");         
  while($data = mysqli_fetch_array($qry)){
 ?>
 <tr>
  <td width="25" bgcolor="#EEEEEE" align="center"><?php echo $data['no'];?></td>
  <td width="202" bgcolor="#EEEEEE" align="center"><?php echo $data['nama'];?></td>
  <td width="70" bgcolor="#EEEEEE" align="center"><?php echo $data['alamat'];?></td>
  <td width="80" bgcolor="#EEEEEE" align="center"><?php echo $data['email'];?></td>
  <td width="115" bgcolor="#EEEEEE" align="center"><?php echo $data['kota'];?></td>
  <td width="152" bgcolor="#EEEEEE" align="center"><?php echo $data['pesan'];?></td>
            
  <td align="center" width="70" bgcolor="#EEEEEE">
   <a href="hapus.php?id=<?php echo $data['no'];?>">
    <input class="button-op" type="submit" name="hapus" id="hapus" value="Hapus" />
   </a>
  </td>
  <td align="center" width="70" bgcolor="#EEEEEE">
   <a href="ubah.php?id=<?php echo $data['no'];?>">
    <input class="button-op" type="submit" name="ubah" id="ubah" value="Ubah" />
   </a>
  </td>
 </tr>
 <?php } ?>
 </table>
 <a href="index.html"><input type="submit" name="masuk" id="masuk" value="Tambah" /></a>

setelah kalian copy source code diatas, jangan lupa simpan terlebih dahulu, karena jika tidak kalian simpan maka prosesnya tidak akan berjalan lancar, ini merupakan kesalahan sepele yang sering dialami programmer pemula, dia berfikir bahwa programnya tidak berjalan akan tetapi sebenarnya mereka belum menyimpan filenya hehe, jadi yang teliti ya.

untuk source code diatas hanya sekedar tampilan dari tabel t_tamu yang bertujuan agar setelah kalian melakukan input data pada buku tamu, kalian bisa melihat hasilnya, apakah benar data yang kalian inputkan sudah masuk atau belum.

dimanakah letak source code menampilkan datanya min?

untuk source menampilkan datanya terletak pada code ini

<?php
  include "koneksi.php";
  $qry = mysqli_query($koneksi, "SELECT * FROM t_tamu");         
  while($data = mysqli_fetch_array($qry)){
 ?>

code tersebut memiliki fungsi menampilkan seluruh data yang ada di tabel t_tamu dan dilakukan perulangan dengan menggunakan fungsi while sebanayk data yang ada di tabel tersebut.

untuk 2 tombol di sebelah kanan hapus dan ubah, akan saya bahas di tutorial selanjutnya, jangan lupa ya klik iklan agar dunia programming bisa terus update tutorial terbaru.