Tugas Bootstrap - PWEB C

Ini merupakan tugas lanjutan dari form pendaftaraan sebelumnya dengan menambahkan Bootstrap yang pad sebelumnya perubahan dilakukan dengan menambahkan AJAX pada form pendaftaraan

Untuk kodingan yang diubah atau ditambahkan adalah pada list-siswa.php

list-siswa.php:

 <?php include("config.php"); ?>  
 <!DOCTYPE html>  
 <html>  
 <head>  
 <script type="text/javascript" src="script.js"></script>  
 <link rel="stylesheet" type="text/css" href="css/bootstrap.css">  
 <script type="text/javascript" src="js/jquery.js"></script>  
 <script type="text/javascript" src="js.bootstap.js"></script>  
 <title>Pendaftaran Siswa Baru | SMK Coding</title>  
 </head>  
 <body>  
   <header>  
     <h3>Siswa yang sudah mendaftar</h3>  
   </header>  
    <button>  <a onclick="daftar()">Tambah Baru</a></button>  
   <br>  
   <center>  
   <table class="table table-bordered table-striped table-hover">  
   <thead>  
     <tr>  
       <th>No</th>  
       <th>Nama</th>  
       <th>Alamat</th>  
       <th>Jenis Kelamin</th>  
       <th>Agama</th>  
       <th>Sekolah Asal</th>  
       <th>Tindakan</th>  
     </tr>  
   </thead>  
   <tbody>  
     <?php  
     $sql = "SELECT * FROM calon_siswa";  
     $query = mysqli_query($db, $sql);  
     while($siswa = mysqli_fetch_array($query)){  
       echo "<tr>";  
       echo "<td>".$siswa['id']."</td>";  
       echo "<td>".$siswa['nama']."</td>";  
       echo "<td>".$siswa['alamat']."</td>";  
       echo "<td>".$siswa['jenis_kelamin']."</td>";  
       echo "<td>".$siswa['agama']."</td>";  
       echo "<td>".$siswa['sekolah_asal']."</td>";  
       echo "<td>";  
       echo "<a href='form-edit.php?id=".$siswa['id']."'>Edit</a> | ";  
       echo "<a href='hapus-data.php?id=".$siswa['id']."'>Hapus</a>";  
       echo "</td>";  
       echo "</tr>";  
     }  
     ?>  
   </tbody>  
   </table>  
   <button><a href="index.php" class="back">Kembali</a></button>  
   <p>Total: <?php echo mysqli_num_rows($query) ?></p>  
   </center>  
   </body>  
 </html>  

Hasilnya adalah sebagai berikut:


Sebelum menggunakan bootstrap:


Komentar