Skip to main content

PWEB-AJAX XML


Nama : Bobbi Adiyta
NRP : 05111740000099
KELAS : PWEB C

Saya membuat tugas pembuatan pendaftaran siswa menjadi xml, laman index.php sekarang bisa langsung mengakses:
  1. List Siswa (list siswa yang sudah mendaftar)
  2. Pendafataran siswa(formulir pendaftaran siswa)
Berikut adalah codingan yang saya gunakan, ada 8 file yang saya gunakan
  1. config.php
     <?php  
 $server = "localhost";  
 $user = "root";  
 $password = "";  
 $nama_database = "pendaftaran_siswa";  
 $db = mysqli_connect($server, $user, $password, $nama_database);  
 // echo "Berhasil bossku";  
 if( !$db ){  
   die("Gagal terhubung dengan database: " . mysqli_connect_error());  
 }  
 ?>
  2. index.php
     <!DOCTYPE html>  
 <html>  
 <head>  
      <title>Pendaftaran siswa baru|| SMA PetaniCoding</title>  
      <script>  
     function showsiswa() {  
       if (window.XMLHttpRequest) {  
         xhttp = new XMLHttpRequest();  
        }  
       xhttp.onreadystatechange = function() {  
         if (this.readyState == 4 && this.status == 200){  
          document.getElementById("demo").innerHTML = this.responseText;  
         }  
       };  
      xhttp.open("GET", "list-siswa.php", true);  
      xhttp.send();  
     }  
     function daftar() {  
       if (window.XMLHttpRequest) {  
         xhttp = new XMLHttpRequest();  
        }  
       xhttp.onreadystatechange = function() {  
         if (this.readyState == 4 && this.status == 200){  
          document.getElementById("demo").innerHTML = this.responseText;  
         }  
       };  
      xhttp.open("GET", "form-daftar.php", true);  
      xhttp.send();  
     }  
     function edit() {  
       if (window.XMLHttpRequest) {  
         xhttp = new XMLHttpRequest();  
        }  
       xhttp.onreadystatechange = function() {  
         if (this.readyState == 4 && this.status == 200){  
          document.getElementById("demo").innerHTML = this.responseText;  
         }  
       };  
      xhttp.open("GET", "form-edit.php", true);  
      xhttp.send();  
     }  
   </script>  
 </head>  
 <body style="text-align: center;">  
           <header>  
                <h3>Pendaftaran siswa baru</h3>  
                <h1>SMA PetaniCoding</h1>  
           </header>  
           <h4>Menu</h4>  
             <p align="center"><button type="button" onclick="showsiswa()">List Siswa</button></p>  
             <p align="center"><button type="button" onclick="daftar()">Pendaftaran Siswa</button></p>  
             </div>  
             <div id="demo">  
             </div>  
 </body>  
 </html>
  3. form-daftar.php
     <!DOCTYPE html>  
 <html>  
 <head>  
      <title>Formulir Pendaftaran Siswa Baru ||SMA PetaniCoding</title>  
 </head>  
 <body style="text-align: center;">  
      <header>  
           <h3>Formulir Pendaftaran Siswa Baru</h3>  
      </header>  
 <form action="proses-pendaftaran.php" method="POST">  
     <fieldset>  
     <p>  
       <label for="nama">Nama: </label>  
       <input type="text" name="nama" placeholder="nama lengkap" />  
     </p>  
     <p>  
       <label for="alamat">Alamat: </label>  
       <textarea name="alamat"></textarea>  
     </p>  
     <p>  
       <label for="jenis_kelamin">Jenis Kelamin: </label>  
       <label><input type="radio" name="jenis_kelamin" value="laki-laki"> Laki-laki</label>  
       <label><input type="radio" name="jenis_kelamin" value="perempuan"> Perempuan</label>  
     </p>  
     <p>  
       <label for="agama">Agama: </label>  
       <select name="agama">  
         <option>Islam</option>  
         <option>Kristen</option>  
         <option>Hindu</option>  
         <option>Budha</option>  
         <option>Atheis</option>  
       </select>  
     </p>  
     <p>  
       <label for="sekolah_asal">Sekolah Asal: </label>  
       <input type="text" name="sekolah_asal" placeholder="nama sekolah" />  
     </p>  
     <p>  
       <input type="submit" value="Daftar" name="daftar" />  
     </p>  
     </fieldset>  
   </form>  
 </body>  
 </html>
  4. proses-pendaftaran.php
     <?php  
 include("config.php");  
 ?>  
 <script>  
     function showsiswa() {  
       if (window.XMLHttpRequest) {  
         xhttp = new XMLHttpRequest();  
        }  
       xhttp.onreadystatechange = function() {  
         if (this.readyState == 4 && this.status == 200){  
         }  
       };  
      xhttp.open("GET", "index.html", true);  
      xhttp.send();  
     }  
   </script>  
 <?php  
 if(isset($_POST['daftar'])){  
     $nama = $_POST['nama'];  
     $alamat = $_POST['alamat'];  
     $jk = $_POST['jenis_kelamin'];  
     $agama = $_POST['agama'];  
     $sekolah_asal = $_POST['sekolah_asal'];  
     $sql = "INSERT INTO calon_siswa (name, alamat, jenis_kelamin, agama,sekolah_asal) VALUE ('$nama', '$alamat', '$jk', '$agama', '$sekolah_asal')";  
     $query = mysqli_query($db, $sql);  
  if( $query ) {  
       header('Location:index.php');  
     } else {  
       echo "gagal daftar";  
     }  
 }   
 else {  
   die("Akses dilarang...");  
 }  
 ?>
  5. form-edit.php
     <?php  
 include("config.php");  
 // kalau tidak ada id di query string  
 if( !isset($_GET['id']) ){  
   header('Location: list-siswa.php');  
 }  
 //ambil id dari query string  
 $id = $_GET['id'];  
 // buat query untuk ambil data dari database  
 $sql = "SELECT * FROM calon_siswa WHERE id=$id";  
 $query = mysqli_query($db, $sql);  
 $siswa = mysqli_fetch_assoc($query);  
 // jika data yang di-edit tidak ditemukan  
 if( mysqli_num_rows($query) < 1 ){  
   die("data tidak ditemukan...");  
 }  
 ?>  
 <!DOCTYPE html>  
 <html>  
 <head>  
   <title>Formulir Edit Siswa | SMK Coding</title>  
 </head>  
 <body style="text-align: center;">  
   <header>  
     <h3>Formulir Edit Siswa</h3>  
   </header>  
   <form action="proses-edit.php" method="POST">  
     <fieldset>  
       <input type="hidden" name="id" value="<?php echo $siswa['id'] ?>" />  
     <p>  
       <label for="name">nama: </label>  
       <input type="text" name="name" placeholder="name lengkap" value="<?php echo $siswa['name'] ?>" />  
     </p>  
     <p>  
       <label for="alamat">Alamat: </label>  
       <textarea name="alamat"><?php echo $siswa['alamat'] ?></textarea>  
     </p>  
     <p>  
       <label for="jenis_kelamin">Jenis Kelamin: </label>  
       <?php $jk = $siswa['jenis_kelamin']; ?>  
       <label><input type="radio" name="jenis_kelamin" value="laki-laki" <?php echo ($jk == 'laki-laki') ? "checked": "" ?>> Laki-laki</label>  
       <label><input type="radio" name="jenis_kelamin" value="perempuan" <?php echo ($jk == 'perempuan') ? "checked": "" ?>> Perempuan</label>  
     </p>  
     <p>  
       <label for="agama">Agama: </label>  
       <?php $agama = $siswa['agama']; ?>  
       <select name="agama">  
         <option <?php echo ($agama == 'Islam') ? "selected": "" ?>>Islam</option>  
         <option <?php echo ($agama == 'Kristen') ? "selected": "" ?>>Kristen</option>  
         <option <?php echo ($agama == 'Hindu') ? "selected": "" ?>>Hindu</option>  
         <option <?php echo ($agama == 'Budha') ? "selected": "" ?>>Budha</option>  
         <option <?php echo ($agama == 'Atheis') ? "selected": "" ?>>Atheis</option>  
       </select>  
     </p>  
     <p>  
       <label for="sekolah_asal">Sekolah Asal: </label>  
       <input type="text" name="sekolah_asal" placeholder="name sekolah" value="<?php echo $siswa['sekolah_asal'] ?>" />  
     </p>  
     <p>  
       <input type="submit" value="Simpan" name="simpan" />  
     </p>  
     </fieldset>  
   </form>  
   </body>  
 </html>
  6. proses-edit.php
     <?php  
 include("config.php");  
 // cek apakah tombol simpan sudah diklik atau blum?  
 if(isset($_POST['simpan'])){  
   // ambil data dari formulir  
   $id = $_POST['id'];  
   $name = $_POST['name'];  
   $alamat = $_POST['alamat'];  
   $jk = $_POST['jenis_kelamin'];  
   $agama = $_POST['agama'];  
   $sekolah = $_POST['sekolah_asal'];  
   // buat query update  
   $sql = "UPDATE calon_siswa SET name='$name', alamat='$alamat', jenis_kelamin='$jk', agama='$agama', sekolah_asal='$sekolah' WHERE id=$id";  
   $query = mysqli_query($db, $sql);  
   // apakah query update berhasil?  
   if( $query ) {  
     // kalau berhasil alihkan ke halaman list-siswa.php  
     header('Location: index.php');  
   } else {  
     // kalau gagal tampilkan pesan  
     die("Gagal menyimpan perubahan...");  
   }  
 } else {  
   die("Akses dilarang...");  
 }  
 ?>
  7. hapus.php
     <?php  
 include("config.php");  
 if( isset($_GET['id']) ){  
   // ambil id dari query string  
   $id = $_GET['id'];  
   // buat query hapus  
   $sql = "DELETE FROM calon_siswa WHERE id=$id";  
   $query = mysqli_query($db, $sql);  
   // apakah query hapus berhasil?  
   if( $query ){  
     header('Location:index.php');  
   } else {  
     die("gagal menghapus...");  
   }  
 } else {  
   die("akses dilarang...");  
 }  
 ?>
  8. list-siswa.php
     <?php include("config.php"); ?>  
 <!DOCTYPE html>  
 <html>  
 <head>  
   <title>Pendaftaran Siswa Baru || SMA PetaniCoding</title>  
 </head>  
 <body style="text-align: center;">  
   <header>  
     <h3>Siswa yang sudah mendaftar</h3>  
   </header>  
   <br>  
   <table border="1" align="center">  
   <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);  
     $nomor=0;  
     while($siswa = mysqli_fetch_array($query)){  
       echo "<tr>";  
       $nomor++;  
       echo "<td>".$nomor."</td>";  
       echo "<td>".$siswa['name']."</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.php?id=".$siswa['id']."'>Hapus</a>";  
       echo "</td>";  
       echo "</tr>";  
     }  
     ?>  
   </tbody>  
   </table>  
   <p>Total: <?php echo mysqli_num_rows($query) ?></p>  
   </body>  
 </html>
Berikut adalah hasilnya:


 
Tampilan awal
 -------------------------------------------------------------------------------------------------------


 
Tampilan List Siswa
 -------------------------------------------------------------------------------------------------------


 
Tampilan Form Pendaftaran Siswa
 -------------------------------------------------------------------------------------------------------


 
Hasil setelah mendaftarkan siswa baru
 -------------------------------------------------------------------------------------------------------


 
Tampilan edit data siswa
 -------------------------------------------------------------------------------------------------------


 
Tampilan hasil edit data siswa
 -------------------------------------------------------------------------------------------------------


 
Tampilan setelah melakukan delete data ke7
 -------------------------------------------------------------------------------------------------------

Labels:

Comments

Post a Comment

Popular posts from this blog

PBO-A Tugas Membuat Rumah

Berikut saya sertakan codingan saya dalam membuat rumah dalam BlueJ. Saya menggunakan 5 kelas dalam mengerjakannya. Class yang pertama adalah canvas. Di dalam class canvas ini berisi fungsi fungsi untuk membuat tempat agar bisa ditempati objek-objek. Berikut codingannya: import javax.swing.*; import java.awt.*; import java.util.List; import java.util.*; public class Canvas { private static Canvas canvasSingleton; public static final Color hijau_pekat = new Color(0,153,0); public static final Color coklat = new Color(102,51,0); public static final Color abuabu = new Color(153,153,153); public static final Color abuabu_gelap = new Color(51,51,51); public static Canvas getCanvas() { if(canvasSingleton == null) { canvasSingleton = new Canvas("BlueJ Shapes Demo", 600, 400, Color.white); } canvasSingleton.setVisible(true); return canvasSingleton; } pr...
1 comment
Read more

PBO - EAS 2018

Nama : Bobbi Aditya Kelas : PBO A NRP : 05111740000099 Berikut adalah dokumentasi dari hasil pekerjaan EAS PBO saya, soal pertama adalah saya diberi tugas untuk merancang tampilan interface dari image viewer saya. Tampilan image viewer saya yang dulu adalah seperti ini Dari tampilan awal yang seperti itu, saya ingin membuat menu-menu pada bagian kiri (bagian smaller,larger). Sehingga fitur-fitur image viewer saya akan terdapat pada bagian tersebut. Rancangan class diagram saya berubah menjadi seperti dibawah ini: Terdapat 7 class dalam imageviewer saya ini. 1. Image Viewer Image Viewer adalah kelas utama dalam program ini, didalam kelas ini terdapat segala proses image viewer. Mulai dari open file,save file,close file, apply filter, membuat interfaces dll. 2.Image File Manager Image File manager adalah kelas untuk open file dan save file ke disk komputer. Segala proses yang berhubungan dengan disk akan berada di dalam class ini. 3.Image Panel Image Panel adalah kel...
Post a Comment
Read more

PWEB-FRAMEWORK

Nama : Bobbi Aditya Kelas : PWEB C NRP : 05111740000099 Dalam kesempatan kali ini, saya melanjutkan tutorial dari petanikode dari tutorial 4 sampai tutorial 6 Dalam tutorial 4, saya belajar untuk melakukan partisi-partisi dalam tampilan index website. Saya melakukan partisi halaman menjadi 7 partisi. Berikut adalah source code dari masing-masing partisi: -head.php <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <title><?php echo SITE_NAME .": ". ucfirst($this->uri->segment(1)) ." - ". ucfirst($this->uri->segment(2)) ?></title> <!-- Bootstrap core CSS--> <link href="<?php echo base_url('assets/bootstrap/css/bootstrap.min.css') ?>" rel="stylesheet"> <!-- Custom fonts for this te...
Post a Comment
Read more