Selasa, 16 Oktober 2018

UTS PWEB - Membuat Input Prestasi

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: Pweb C

Hasil:





1. Database
2. Source Code Config.php

 <?php   
  $server = "localhost";   
  $user = "root";   
  $password = "";   
  $nama_database = "prestasi-siswa";   
  $db = mysqli_connect($server, $user, $password , $nama_database);   
  if( !$db ){   
   die("Gagal terhubung dengan database: " . mysqli_connect_error());   
  }   
  ?>   

3. Source Code index.php

 <!DOCTYPE html>   
  <html>   
  <head>   
  <style type="text/css">   
  body   
  {   
   background:#FAEBD7;   
   font-family:courier;   
  }   
 </style>  
   <title>INPUT PRESTASI SISWA</title>   
  </head>   
  <body>   
   <header>   
 <div class= "kepala">    
    <h3>INPUT PRESTASI SISWA</h3>   
    <h3>SMA Coding</h3>   
 </div>  
   </header>   
   <h4>Menu</h4>   
   <nav>   
    <ul>   
     <li><a href="input_siswa.php">Input Prestasi</a></li>   
     <li><a href="list-siswa.php">List Prestasi Siswa</a></li>   
    </ul>   
   </nav>   
  <?php if(isset($_GET['status'])): ?>   
   <p>   
    <?php   
     if($_GET['status'] == 'sukses'){   
      echo "Pendaftaran siswa baru berhasil!";   
     } else {   
      echo "Pendaftaran gagal!";   
     }   
    ?>   
   </p>   
  <?php endif; ?>   
   </body>   
  </html>   

4. Source Code list-siswa.php

 <?php include("config.php"); ?>  
 <!DOCTYPE html>  
 <html>  
 <head>  
  <style type="text/css">   
  body   
  {   
   background:#FAEBD7;   
   font-family:courier;   
  }   
 </style>  
   <title>DAFTAR PRESTASI SISWA</title>  
 </head>  
 <body>  
   <header>  
     <h3>Berikut Ini Daftar Prestasi Siswa</h3>  
   </header>  
   <nav>  
     <a href="input_siswa.php">[+] Tambah Baru</a>  
   </nav>  
   <br>  
   <table border="1">  
   <thead>  
     <tr>  
       <th>No</th>  
       <th>Kelas</th>  
       <th>Semester</th>  
       <th>Nama Siswa</th>  
       <th>Prestasi</th>  
       <th>Keterangan</th>  
       <th>Tindakan</th>  
     </tr>  
   </thead>  
   <tbody>  
     <?php  
     $sql = "SELECT * FROM datasiswa";  
     $query = mysqli_query($db, $sql);  
     while($siswa = mysqli_fetch_array($query)){  
       echo "<tr>";  
       echo "<td>".$siswa['id']."</td>";  
       echo "<td>".$siswa['kelas']."</td>";  
       echo "<td>".$siswa['semester']."</td>";  
       echo "<td>".$siswa['nama']."</td>";  
       echo "<td>".$siswa['prestasi']."</td>";  
       echo "<td>".$siswa['keterangan']."</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>  

5. Source Code input-siswa.php

  <!DOCTYPE html>   
  <html>   
  <head>   
  <style type="text/css">   
  body   
  {   
   background:#FAEBD7;   
   font-family:courier;   
  }   
 </style>  
   <title>INPUT PRESTASI SISWA SMA CODING</title>   
  </head>   
  <body>   
   <header>   
    <h3>Input Prestasi Siswa</h3>   
   </header>   
   <form action="proses-input.php" method="POST">   
    <fieldset>   
    <p>   
     <label for="kelas">Kelas: </label>   
     <input type="text" name="kelas" placeholder="Kelas" />   
    </p>   
       <p>   
     <label for="semester">Semester: </label>   
     <input type="text" name="semester" placeholder="Semester" />   
    </p>  
      <p>   
     <label for="nama">Nama: </label>   
     <input type="text" name="nama" placeholder="Nama" />   
    </p>   
    <p>   
     <label for="prestasi">Prestasi: </label>   
     <textarea name="prestasi"></textarea>   
    </p>  
      <p>   
     <label for="keterangan">Keterangan: </label>   
     <textarea name="keterangan"></textarea>   
    </p>         
    <p>   
     <input type="submit" value="input" name="input" />   
    </p>   
    </fieldset>   
   </form>   
   </body>   
  </html>   

6. Source Code Input-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 datasiswa 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>  
  <style type="text/css">   
  body   
  {   
   background:#FAEBD7;   
   font-family:courier;   
  }   
 </style>   
   <title>Edit Input Prestasi</title>   
  </head>   
  <body>   
   <header>   
    <h3>Edit Prestasi Siswa</h3>   
   </header>   
   <form action="proses-edit.php" method="POST">   
    <fieldset>   
     <input type="hidden" name="id" value="<?php echo $siswa['id'] ?>" />  
      <p>   
     <label for="kelas">Kelas: </label>   
     <input type="text" name="kelas" placeholder="kelas" value="<?php echo $siswa['kelas'] ?>" />   
    </p>         
    <p>   
     <label for="semester">Semester: </label>   
     <input type="text" name="semester" placeholder="semester" value="<?php echo $siswa['semester'] ?>" />   
    </p>  
       <p>   
     <label for="nama">Nama: </label>   
     <input type="text" name="nama" placeholder="nama lengkap" value="<?php echo $siswa['nama'] ?>" />   
    </p>  
    <p>   
     <label for="prestasi">Prestasi: </label>   
     <textarea name="prestasi"><?php echo $siswa['prestasi'] ?></textarea>   
    </p>   
      <p>   
     <label for="keterangan">Keterangan: </label>   
     <textarea name="keterangan"><?php echo $siswa['keterangan'] ?></textarea>   
    </p>        
    <p>   
     <input type="submit" value="Simpan" name="simpan" />   
    </p>   
    </fieldset>   
   </form>   
   </body>   
  </html>   

7. Source Code hapus.php
  <?php   
  include("config.php");   
  if( isset($_GET['id']) ){   
   // ambil id dari query string   
   $id = $_GET['id'];   
   // buat query hapus   
   $sql = "DELETE FROM datasiswa WHERE id=$id";   
   $query = mysqli_query($db, $sql);   
   // apakah query hapus berhasil?   
   if( $query ){   
    header('Location: list-siswa.php');   
   } else {   
    die("gagal menghapus...");   
   }   
  } else {   
   die("akses dilarang...");   
  }   
  ?>   

8. Source Code Proses-edit.php
 <?php   
  include("config.php");   
  
  if(isset($_POST['simpan'])){   
   $id = $_POST['id'];   
   $kelas = $_POST['kelas'];   
   $semester = $_POST['semester'];   
   $nama = $_POST['nama'];   
   $prestasi = $_POST['prestasi'];   
   $keterangan = $_POST['keterangan'];   
   // buat query update   
   $sql = "UPDATE datasiswa SET kelas='$kelas', semester='$semester', nama='$nama', prestasi='$prestasi', keterangan='$keterangan' WHERE id=$id";   
   $query = mysqli_query($db, $sql);   
   // apakah query update berhasil?   
   if( $query ) {   
    // kalau berhasil alihkan ke halaman list-siswa.php   
    header('Location: list-siswa.php');   
   } else {   
    // kalau gagal tampilkan pesan   
    die("Gagal menyimpan perubahan...");   
   }   
  } else {   
   die("Akses dilarang...");   
  }   
  ?>   


9. Source Code proses_input.php


 <?php   
  include("config.php");   
    
  if(isset($_POST['input'])){    
   $kelas = $_POST['kelas'];   
   $semester = $_POST['semester'];   
   $nama = $_POST['nama'];   
   $prestasi = $_POST['prestasi'];   
   $keterangan = $_POST['keterangan'];   
   // buat query   
   $sql = "INSERT INTO datasiswa (kelas, semester, nama, prestasi, keterangan) VALUE ('$kelas', '$semester', '$nama', '$prestasi', '$keterangan')";   
   $query = mysqli_query($db, $sql);   
   // apakah query simpan berhasil?   
   if( $query ) {   
    // kalau berhasil alihkan ke halaman index.php dengan status=sukses   
    header('Location: index.php?status=sukses');   
   } else {   
    // kalau gagal alihkan ke halaman indek.php dengan status=gagal   
    header('Location: index.php?status=gagal');   
   }   
  } else {   
   die("Akses dilarang...");   
  }   
  ?>   

Senin, 15 Oktober 2018

Nama:Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PWEB C
Sumber Belajar: Petani Kode

1. Config.php

 <?php  
 $server = "localhost";  
 $user = "root";  
 $password = "";  
 $nama_database = "pendaftaran_siswa";  
 $db = mysqli_connect($server, $user, $password , $nama_database);  
 if( !$db ){  
   die("Gagal terhubung dengan database: " . mysqli_connect_error());  
 }  
 ?>  

2.form-daftar.php

 <!DOCTYPE html>  
 <html>  
 <head>  
   <title>Formulir Pendaftaran Siswa Baru | SMK Coding</title>  
 </head>  
 <body>  
   <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>Katolik</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>  

3. Form-edit.php

 erikut:  
 <?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>  
   <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="nama">Nama: </label>  
       <input type="text" name="nama" placeholder="nama lengkap" value="<?php echo $siswa['nama'] ?>" />  
     </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 == 'Katolik') ? "selected": "" ?>>Katolik</option>  
       </select>  
     </p>  
     <p>  
       <label for="sekolah_asal">Sekolah Asal: </label>  
       <input type="text" name="sekolah_asal" placeholder="nama sekolah" value="<?php echo $siswa['sekolah_asal'] ?>" />  
     </p>  
     <p>  
       <input type="submit" value="Simpan" name="simpan" />  
     </p>  
     </fieldset>  
   </form>  
   </body>  
 </html>  

4. 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: list-siswa.php');  
   } else {  
     die("gagal menghapus...");  
   }  
 } else {  
   die("akses dilarang...");  
 }  
 ?>  

5. index.php

 <!DOCTYPE html>  
 <html>  
 <head>  
   <title>Pendaftaran Siswa Baru | SMK Coding</title>  
 </head>  
 <body>  
   <header>  
     <h3>Pendaftaran Siswa Baru</h3>  
     <h1>SMK Coding</h1>  
   </header>  
   <h4>Menu</h4>  
   <nav>  
     <ul>  
       <li><a href="form-daftar.php">Daftar Baru</a></li>  
       <li><a href="list-siswa.php">Pendaftar</a></li>  
     </ul>  
   </nav>  
 <?php if(isset($_GET['status'])): ?>  
   <p>  
     <?php  
       if($_GET['status'] == 'sukses'){  
         echo "Pendaftaran siswa baru berhasil!";  
       } else {  
         echo "Pendaftaran gagal!";  
       }  
     ?>  
   </p>  
 <?php endif; ?>  
   </body>  
 </html>  

6. list-siswa.php

 <?php include("config.php"); ?>  
 <!DOCTYPE html>  
 <html>  
 <head>  
   <title>Pendaftaran Siswa Baru | SMK Coding</title>  
 </head>  
 <body>  
   <header>  
     <h3>Siswa yang sudah mendaftar</h3>  
   </header>  
   <nav>  
     <a href="form-daftar.php">[+] Tambah Baru</a>  
   </nav>  
   <br>  
   <table border="1">  
   <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.php?id=".$siswa['id']."'>Hapus</a>";  
       echo "</td>";  
       echo "</tr>";  
     }  
     ?>  
   </tbody>  
   </table>  
   <p>Total: <?php echo mysqli_num_rows($query) ?></p>  
   </body>  
 </html>  

7. 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'];  
   $nama = $_POST['nama'];  
   $alamat = $_POST['alamat'];  
   $jk = $_POST['jenis_kelamin'];  
   $agama = $_POST['agama'];  
   $sekolah = $_POST['sekolah_asal'];  
   // buat query update  
   $sql = "UPDATE calon_siswa SET nama='$nama', 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: list-siswa.php');  
   } else {  
     // kalau gagal tampilkan pesan  
     die("Gagal menyimpan perubahan...");  
   }  
 } else {  
   die("Akses dilarang...");  
 }  
 ?>  

8. proses-pendaftaraan.php

 <?php  
 include("config.php");  
 // cek apakah tombol daftar sudah diklik atau blum?  
 if(isset($_POST['daftar'])){  
   // ambil data dari formulir  
   $nama = $_POST['nama'];  
   $alamat = $_POST['alamat'];  
   $jk = $_POST['jenis_kelamin'];  
   $agama = $_POST['agama'];  
   $sekolah = $_POST['sekolah_asal'];  
   // buat query  
   $sql = "INSERT INTO calon_siswa (nama, alamat, jenis_kelamin, agama, sekolah_asal) VALUE ('$nama', '$alamat', '$jk', '$agama', '$sekolah')";  
   $query = mysqli_query($db, $sql);  
   // apakah query simpan berhasil?  
   if( $query ) {  
     // kalau berhasil alihkan ke halaman index.php dengan status=sukses  
     header('Location: index.php?status=sukses');  
   } else {  
     // kalau gagal alihkan ke halaman indek.php dengan status=gagal  
     header('Location: index.php?status=gagal');  
   }  
 } else {  
   die("Akses dilarang...");  
 }  
 ?>  


Hasil:






Minggu, 14 Oktober 2018

PBO A- Membuat EPARKIR

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PBO A

1. Source code EPARKIR

 /**  
  * Class EParkir ini digunakan untuk mengatur alur kerja  
  * dari sistem parkir elektronik  
  * @author Ayu Mutiara Sari  
  * @version 01.2018/10/15  
  */  
  import java.util.Scanner;    
  public class EParkir   
  {   
   private static int JKend,harga;  
   public static void main(String args[])   
   {   
   Scanner input= new Scanner(System.in);    
   kendaraan akend = new kendaraan();  
   System.out.println("SELAMAT DATANG DI TAMAN SEJAHTERA");  
   System.out.println("Biaya Parkir Rp 2000(MOBIL) Rp 500(MOTOR)");   
   System.out.println("Pilih Jenis Kendaraan Nada");   
   System.out.println("1.Mobil");   
   System.out.println("2.Motor");   
   JKend=input.nextInt();   
   switch (JKend){   
    case 1:   
    System.out.println("Masukkan Nopol kendaraan anda");   
    akend.getNopol();   
    System.out.println("Masukkan Durasi Parkir Anda (jam) : ");   
    akend.getDurasi();   
    harga = akend.getHarga(2000);   
    akend.print();  
    break;  
    case 2:    
    System.out.println("Masukkan Nomor Polisi kendaraan anda");   
    akend.getNopol();   
    System.out.println("Pilih Durasi parkir anda (jam) : ");   
    akend.getDurasi();   
    harga = akend.getHarga(500);    
    akend.print();  
    break;    
   }  
  }   
  }   


2. Source Code kendaraan


 /**  
  * Class kendaraan ini digunakan untuk mengatur alur kerja  
  * dari sistem parkir elektronik  
  * @author Ayu Mutiara Sari  
  * @version 02.2018/10/15  
  */    
  import java.util.Scanner;    
  public class kendaraan   
  {   
   private static int harga;   
   private static String nopol;   
   private static int durasi;  
   Scanner input= new Scanner(System.in);   
  public kendaraan (){   
   harga = 0;   
 }  
   public void getDurasi(){   
    durasi = input.nextInt();   
   }   
   public int getHarga(int biaya)   
   {   
    harga = biaya * durasi;   
    return harga;   
   }   
   public void getNopol(){   
    nopol = input.nextLine();   
   }   
   public void print(){   
    System.out.println("SELAMAT DATANG DI TAMAN SEJAHTERA");   
    System.out.println(" BERIKUT DATA KENDARAAN ANDA:");   
    System.out.println(" NoPol : "+nopol);   
    System.out.println(" Durasi : "+durasi+" Jam");   
    System.out.println(" Biaya: "+harga+"");   
    System.out.println(" Terima Kasih");   
   }   
  }   


Hasil:




PBO A- Support System Sederhana

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PBO A

1. Source Code Support System

 /**  
  * Class ini digunakan untuk membuat support system.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version 01.01(10/8/2018)  
  */  
  public class SupportSystem    
  {    
   private InputReader reader;    
   private Responder responder;    
   public SupportSystem(){    
   reader = new InputReader();    
   responder = new Responder();    
   }    
   public void start(){    
   boolean finished = false;    
   printWelcome();    
   while(!finished){    
    String input = reader.getInput();    
    if(input.startsWith("bye")) {    
    finished = true;    
    }    
    else {    
    String response = responder.generateResponse();    
    System.out.println(response);    
    }    
   }    
   printGoodbye();    
   }    
   private void printWelcome(){    
    System.out.println("Hello");    
    System.out.println("=============================");    
    System.out.println("Tell me something I don't know!");     
    System.out.println("Say 'bye' to exit"); }    
   private void printGoodbye(){    
    System.out.println("Good Bye!.");    
   }    
  }    

2. Source Code Responder

 /**  
  * Write a description of class Responder here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version 01.02(10/08/2018)  
  */  
 public class Responder  
 {  
 /**  
 * Construct a Responder - nothing to do  
 */  
 public Responder()  
 {  
 }  
 /**  
 * Generate a response.  
 * @return A string that should be displayed as the  
 * response  
 */  
 public String generateResponse()  
 {  
 return "Wow! Cool!";  
 }  
 }  

3. Source Code InputReader

 /**  
  * Write a description of class input here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version 01.02(10/08/2018)  
  */  
  import java.util.Scanner;   
  public class InputReader   
  {   
   public String getInput()   
   {   
    Scanner input = new Scanner(System.in);   
    String in = input.nextLine();   
    return in;   
   }   
  }   

Hasil:



Selasa, 09 Oktober 2018

PWeb C Form Tagihan

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PWEB C
Link: ini linknya

source code index.php:

 <?php  
  session_start();  
  $kodeErr = $no_pelErr = $namaErr ="";   
    $no_telp = $tipe = $alamat = $biaya_beban= $harga_perM3="";   
    $jumlah_pemakaian = $total_tagihan="";   
 ?>  
 <!DOCTYPE html>  
  <head>  
  <style type="text/css">  
  body  
  {  
    background:#DC143C;  
    font-family:courier;  
  }  
  #isitagihan  
  {  
    width:70%;  
    margin:3em auto;  
    padding:30px;  
    background:#DCDCDC;  
    box-shadow:0 0 15px #F8F8FF;  
  }  
  h1  
  {  
    margin:0;  
    padding:0;  
    font-size:2.5em;  
    font-weight:bold;  
  }  
  p  
  {  
    font-size:1em;  
    margin:0;  
  }  
  table  
  {  
    margin:2em 0 0 0;  
    border:1px solid #eee;  
    width:100%;  
    border-collapse: separate;  
    border-spacing:0;  
  }  
  table th  
  {  
    background:#fafafa;  
    border:none;  
    padding:20px ;  
    font-weight:normal;  
    text-align:left;  
  }  
  table td  
  {  
    background:#fff;   
    border:none;  
    padding:12px 20px;   
    font-weight:normal;  
    text-align:left;   
    border-top:1px solid #eee;  
  }  
  table tr.total td  
  {  
    font-size:1.5em;  
  }  
  .btnsubmit  
  {  
    display:inline-block;  
    padding:10px;  
    border:1px solid #ddd;  
    background:#eee;  
    color:#90EE90;  
    text-decoration:none;  
    margin:2em 0;  
  }  
  form  
  {  
    margin:2em 0 0 0;  
  }  
  label  
  {  
    display:inline-block;  
    width:12em;  
  }  
  input[type=text]  
  {  
    border:2px solid #bbb;  
    padding:10px;  
    width:30em;  
  }  
  textarea  
  {  
    border:2px solid #bbb;  
    padding:10px;  
    width:30em;  
    height:5em;  
    vertical-align:text-top;  
    margin:0.3em 0 0 0;  
  }  
  .submitbtn  
  {  
    font-size:1.5em;  
    display:inline-block;  
    padding:10px;  
    border:1px solid #ddd;  
    background:#90EE90;  
    color:#000;  
    text-decoration:none;  
    margin:0.5em 0 0 8em;  
  };  
  </style>  
  </head>  
  <body>  
  <div id="isitagihan">  
   <h1>PEMBAYARAN TAGIHAN PDAM</h1>  
   <script type="text/javascript">  
   function validasi_input(form)  
   {  
     pola_nopel=/^[0-9\_\-]{6,100}$/;  
           if (form.kode.value == "")  
     {  
       alert("Silahkan Pilih Kode yang Sesuai.");  
       form.nama_depan.focus();  
       return (false);  
     }  
           else if (!pola_nopel.test(form.no_pel.value))  
     {  
       alert ('Silahkan isi Nomor Pelanggan Anda dengan Benar');  
       form.no_pel.focus();  
       return false;  
     }  
     else if (form.nama.value == "")  
     {  
       alert("Silahkan Isi Nama Anda");  
       form.nama_depan.focus();  
       return (false);  
     }  
           else if (form.no_telp.value <=11 && form.no_telp.value >=13 )  
     {  
       alert("Silahkan Isi Nomor Telepon Anda dengan Benar");  
       form.no_telp.focus();  
       return (false);  
     }  
           else if (form.tipe.value == "")  
     {  
       alert("Silahkan Pilih Tipe Tagihan Anda dengan Benar");  
       form.tipe.focus();  
       return (false);  
     }  
     else if (form.alamat.value == "")  
     {  
       alert("Silahkan Isi Alamat Anda dengan Benar");  
       form.alamat.focus();  
       return (false);  
     }  
            else if (form.biaya_beban.value == "")  
     {  
       alert("Silahkan Isi Biaya Beban Anda dengan Benar");  
       form.biaya_beban.focus();  
       return (false);  
     }  
            else if (form.harga_perM3.value == "")  
     {  
       alert("Silahkan Isi Harga Per M3 dengan Benar");  
       form.harga_perM3.focus();  
       return (false);  
     }  
            else if (form.jumlah_pemakaian.value == "")  
     {  
       alert("Silahkan Isi Jumlah Pemakaian Anda dengan Benar");  
       form.jumlah_pemakaian.focus();  
       return (false);  
     }  
            else if (form.total_tagihan.value == "")  
     {  
       alert("Silahkan Isi Total Tagihan Anda dengan Benar");  
       form.total_tagihan.focus();  
       return (false);  
     }  
   return (true);  
   }  
   </script>  
   <form action="invoice.php" method="POST" onsubmit="return validasi_input(this)">  
  <div> <label>Kode</label>  
      <input type="text" name="kode" list="kode"/>    
         <datalist id="kode">    
         <option value="SBY_1"></option>    
         <option value="SBY_2"></option>    
         <option value="SBY_3"></option>    
         <option value="SBY_4"></option>    
         <option value="SBY_5"></option>    
         </datalist>   
  <div> <label>No Pelanggan </label>  
      <input type="text" name="no_pel" class="inputan" /> </div>  
  <div> <label>Nama </label>  
      <input type="text" name="nama" class="inputan" /> </div>  
      <div> <label>No Telp </label>  
      <input type="text" name="no_telp" class="inputan" /> </div>  
  <div>  
           <label>Tipe</label>  
      <input type="text" name="tipe" list="tipe"/>    
         <datalist id="tipe">    
          <option value="Rumah"></option>    
         <option value="Toko"></option>    
         <option value="Swalayan"></option>    
         <option value="Pabrik"></option>    
         <option value="Lainnya"></option>    
         </datalist>    
      </div>  
   <div> <label>Alamat </label>  
   <textarea name="alamat" class="textan"></textarea> </div>  
   <div> <label>Biaya Beban </label>  
      <input type="text" name="biaya_beban" class="inputan" /> </div>  
      <div> <label>Harga per M3</label>  
      <input type="text" name="harga_perM3" class="inputan" /> </div>  
      <div> <label>Jumlah Pemakaian</label>  
      <input type="text" name="jumlah_pemakaian" class="inputan" /> </div>  
      <div> <label>Total Tagihan</label>  
      <input type="text" name="total_tagihan" class="inputan" /> </div>  
   <input type="submit" name="Proses" value="Proses" class="submitbtn" />  
   </form>  
  </div>  
  </body>  
 </html>  


source code invoice.php:

 <!DOCTYPE html>   
  <html>   
  <head>   
 <style type="text/css">    
  body  
  {  
    background:#DC143C;  
    font-family:courier;  
  }  
  h1  
  {  
    margin:0;  
    padding:0;  
    font-size:2.5em;  
    font-weight:bold;  
   }  
   #content  
  {  
    width:70%;  
    margin:3em auto;  
    padding:30px;  
    background:#DCDCDC;  
    box-shadow:0 0 15px #F8F8FF;  
  }  
  table {  
   font-family: arial, sans-serif;  
   border-collapse: collapse;  
   width: 100%;  
 }  
 td, th {  
   border: 1px solid #dddddd;  
   text-align: left;  
   padding: 8px;  
 }  
 tr:nth-child(even) {  
   background-color: #dddddd;  
 }  
       </style>  
    <title>Bukti Pembayaran</title>   
  </head>   
  <body>   
    <h1>Pembayaran Tagihan PDAM</h1>    
    <div id="content" style="padding-left: 120px">   
       <table>  
  <tr>  
   <th>Kode</th>  
   <th>No_pel</th>  
   <th>Nama</th>  
      <th>No_telp</th>  
      <th>tipe</th>  
  </tr>  
  <tr>  
   <td><?php echo $_POST["kode"]; ?></td>  
   <td><?php echo $_POST["no_pel"]; ?></td>  
   <td><?php echo $_POST["nama"]; ?></td>  
      <td><?php echo $_POST["no_telp"]; ?></td>  
      <td><?php echo $_POST["tipe"]; ?></td>  
  </tr>  
       <br>  
       <br>  
       <tr>  
   <th>Alamat</th>  
   <th>Biaya Beban</th>  
   <th>Harga Per M3</th>  
      <th>Jumlah Pemakaian</th>  
      <th>Total Tagihan</th>  
  </tr>  
  <tr>  
   <td><?php echo $_POST["alamat"]; ?></td>  
   <td><?php echo $_POST["biaya_beban"]; ?></td>  
   <td><?php echo $_POST["harga_perM3"]; ?></td>  
      <td><?php echo $_POST["jumlah_pemakaian"]; ?></td>  
      <td><?php echo $_POST["total_tagihan"]; ?></td>  
  </tr>  
  </body>   
  </html>   


hasil:





Minggu, 07 Oktober 2018

PBO A- Auction

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PBO A
Membuat Program Lelang

1. Source code Auction

 /**  
  * Write a description of class auction here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version (10.10)  
  */  
  import java.util.ArrayList;   
  import java.util.Iterator;   
  public class Auction   
  {   
   // The List of Lots in this auction.   
   private ArrayList<Lot> lots;   
   // The number that will be given to the next lot entered   
   // into this auction   
   private int nextLotNumber;   
   /**   
   * Create a new auction   
   */   
   public Auction()   
   {   
    lots = new ArrayList<Lot>();   
    nextLotNumber = 1;   
   }   
   /**   
   * Enter a new lot into the auction.   
   * @param description A description of the lot.   
   */   
   public void enterLot(String description)   
   {   
    lots.add(new Lot(nextLotNumber, description));   
    nextLotNumber++;   
   }   
   /***    
   * Show the full list of lots in this auction.   
   */   
   public void showLots()   
   {   
    for(Lot lot : lots){   
     System.out.println(lot.toString());   
    }   
   }   
   /**   
   * Bid for a lot.   
   * A message indicating whether the bid is succesful or not is printed.   
   * @param number The lot number being bid for.   
   * @param bidder The person bidding for the lot.   
   * param value The value of the bid.   
   */   
   public void bidFor(int lotNumber, Person bidder, long value)   
   {   
    Lot selectedLot = getLot(lotNumber);   
    if(selectedLot!=null){   
     boolean successful = selectedLot.bidFor(new Bid(bidder,value));   
     if (successful) {   
      System.out.println("The bid for lot number " + lotNumber +    
      " was successful.");   
     }   
     else {   
      //Report which bid is higher.   
      Bid highestBid = selectedLot.getHighestBid();   
      System.out.println("Lot number: " + lotNumber +    
      " already has a bid of: " + highestBid.getValue());   
     }   
    }   
   }   
   /**   
   * Return a list of the unsold lots.   
   */   
   public void close()   
   {   
    System.out.println("The auction is closed.");   
    for(Lot lot : lots) {   
     System.out.println(lot.getNumber() + ": " +lot.getDescription());   
     Bid bid = lot.getHighestBid();   
     if (bid==null){   
      System.out.println("(No Bids for this lot.)");   
     }   
     else {   
      System.out.println( "sold to " +    
      bid.getBidder().getName() + " for "    
      + bid.getValue());   
    }   
   }   
  }   
   /**    
   * Return the lot with the given number.    
   * Return null if a lot with this number does not exist.   
   * @param lotNumber The number of the lot to return.   
   */   
   public Lot getLot(int lotNumber)   
   {   
    if((lotNumber >= 1) && (lotNumber < nextLotNumber)) {   
     // The number seems to be reasonable.   
     Lot selectedLot = lots.get(lotNumber - 1);   
     // Include a confidence check to be sure we have the right lot.   
     if(selectedLot.getNumber() != lotNumber) {   
      System.out.println("Internal error: lot number " +   
      selectedLot.getNumber() + " was returned instead of " +    
      lotNumber);   
      // Don't return invalid lot.   
      selectedLot = null;   
      }   
      return selectedLot;   
     }   
    else {   
     System.out.println("lot number: " + lotNumber + " does not exist.");   
     return null;   
     }   
    }   
   }   

2. Source Code Lot

 /**  
  * Write a description of class Lot here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version (01.01)  
  */  
 public class Lot   
  {   
   // A unique identifying number.   
   private final int number;   
   //A description of the lot.   
   private String description;   
   // The current highest bid for this lot.   
   private Bid highestBid;   
   /**   
   * Construct a Lot, setting its number and description.   
   * @param number The lot number.   
   * @param description A description of this lot.   
   */   
   public Lot(int number, String description)   
   {   
    this.number = number;   
    this.description = description;   
   }   
   /**   
   * Attempt to bid for this lot. A successful bid   
   * must have a value higher than any existing bid.   
   * @param bid A new bid.   
   * @return true if successful, false otherwise.   
   */   
   public boolean bidFor(Bid bid)   
   {   
    if((highestBid == null)||(bid.getValue() > highestBid.getValue()))   
    {   
     // This bid is the best so far   
     highestBid = bid;   
     return true;   
    }   
    else{   
     return false;   
    }   
   }   
   /**   
   * @return A string representation of this lot's details.   
   */   
   public String toString()   
   {   
    String details = number + ": " + description;   
    if(highestBid!=null) {   
     details+= " Bid: " +highestBid.getValue();   
    }   
    else {   
     details += " (No bid)";   
    }   
    return details;   
   }   
   /**   
   * @return The lot's number.   
   */   
   public int getNumber()   
   {   
    return number;   
   }   
   /**   
   * @return The lot's description.   
   */   
   public String getDescription()   
   {   
    return description;   
   }   
   /**   
   * @return The highest bid for this lot.   
   * This could be null if there is no current bid.   
   */   
   public Bid getHighestBid()   
   {   
    return highestBid;   
   }   
  }   

3. Source Code Person

 /**  
  * Write a description of class person here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version (01.01)  
  */  
  public class Person   
  {   
   // The name of this person.   
   private final String name;   
   /**   
   * Create a new person with the given name.   
   * @param name The person's name.   
   */   
   public Person(String name)   
   {   
    this.name = name;   
   }   
   /**   
   * @return The Person's name*   
   */   
   public String getName()   
   {   
    return name;   
   }   
  }   

4. Source Code Bid

 /**  
  * Write a description of class bid here.  
  *  
  * @author (Ayu Mutiara Sari)  
  * @version (01.01)  
  */  
 public class Bid   
  {   
   // The person making the bid   
   private final Person bidder;   
   // The value of the bid. This could be a large number so the long type has been used   
   private final long value;   
   /**   
   * Create a bid   
   * @param bidder Who is bidding for the lot.   
   * @param value The value of the bid.   
   */   
   public Bid(Person bidder, long value)   
   {   
    this.bidder = bidder;   
    this.value = value;   
   }   
   /**   
   *@return The bidder.   
   */   
   public Person getBidder()   
   {   
    return bidder;   
   }   
   /**   
   * @return The value of the bid.   
   */   
   public long getValue()   
   {   
    return value;   
   }   
  }   

Hasil:



Selasa, 02 Oktober 2018

PWEBc- Tugas Berita dan Form Validasi

Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PWEB C
link: klik di sini

1. Source Code HTML

 <!DOCTYPE html>   
  <html>   
  <head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">   
    <title>Tech in Asia</title>   
    <link rel="stylesheet" href="yeay.css"/>   
  </head>   
  <body>   
    <div class="header">   
    <div class="menu">   
       <ul>   
         <li><a href="#">NEWS</a></li>   
         <li><a href="#">JOBS</a></li>   
         <li><a href="#">COMPANIES</a></li>   
         <li><a href="#">EVENT</a></li>   
         <li><a href="#">ABOUT</a></li>   
         <li><a href="#">ADVERTISE</a></li>   
       </ul>   
    </div>   
    <div class="menu1">   
       <ul>   
         <li><a href="#">CATEGORIES</a></li>   
         <li><a href="#">MARKETS</a></li>   
         <li><a href="#">WRITERS</a></li>  
           <div id="akun">  
        <li><a href="#"><li>LOG IN</00000000li></a>  
        <li><a href="form.htm"><li>SIGN UP</li></a>  
       </div>   
       </ul>   
    </div>   
    </div>   
    <div class="content">   
       <div class="jarak">   
         <!-- kiri -->   
         <div class="kiri">   
         <!-- blog -->   
         <div class="border">   
            <div class="jarak">   
              <img src="web1.jpg" style=" float: left; width: 280px;height: 200px;">   
              <h3>How one Silicon Valley investor helps US startups enter Japan</h3>   
              <p>Hire the right country manager.</p>   
              <button class="btn">Read More..</button>   
            </div>   
         </div>   
         <!-- end blog-->   
         <!-- blog -->   
         <div class="border">   
            <div class="jarak">   
              <img src="web3.jpg" style="float: left;width: 300px;height: 200px;">   
              <h3>I oversee government digital services at GovTech. Ask me anything!</h3>   
              <p>Before GovTech, Parimal was director of technology at DreamWorks Animation. Ask him anything!</p>   
              <button class="btn">Read More..</button>   
            </div>   
         </div>   
         <!-- end blog-->   
         <!-- blog -->   
         <div class="border">   
            <div class="jarak">   
              <img src="web2.jpg" style="float: left;width: 300px;height: 200px;">   
              <h3>Singapore introduces new rules for bike-share users, fines for abusers</h3>   
              <p>The rules are part of the Land Transport Authority’s new licensing regime for bike-sharing services.</p>   
              <button class="btn">Read More..</button>   
            </div>   
         </div>   
         <!-- end blog-->   
         </div>   
         <!-- kiri-->   
         <!-- kanan -->   
         <div class="kanan">   
            <div class="jarak">   
              <h2>LATEST JOBS</h2>   
                 <img src="job1.png" style="float: left;width: 34px;height: 34px;">   
                 <h1>Software Engineer-Backend</h1>   
                 <p>Jakarta, Indonesia</p>   
                 <img src="job2.png" style="float: left;width: 34px;height: 34px;">   
                 <h1>Graphic Designer</h1>   
                 <p>Singapore, Singapore</p>   
                 <img src="job3.png" style="float: left;width: 34px;height:34px;">   
                 <h1>Senior NodeJs Developer</h1>   
                 <p>Singapore, Singapore</p>    
            </div>   
            <div class="footer" >   
              <h2>Copyright 2018 PwebC</h2>   
            </div>   
         </div>   
         <!-- kanan -->   
       </div>   
    </div>   
  </body>   
  </html>  

2. Source Code CSS

 body{   
    background: #FF7F50;   
    color: #333;   
  /*   width: 100% ;   
    height: 100%;*/   
    font-family: "lato", cursive, sans-serif;   
    /*margin: 0 auto;*/   
  }   
  .content{   
    width: 88%;   
    margin: auto;   
    /*height: 420px;*/   
    padding: 0.1px;   
    background: #FFF8DC;   
    color: #333;   
  }   
  .header{   
    margin: 0;   
    background: #FFF8DC;   
  }   
  .kiri{   
    width: 70%;   
    float: left;   
    margin: auto;   
    background: #FFF8DC;   
    /*height: 420px;*/   
  }   
  .kanan{   
    width: 25%;   
    float: left;   
    margin: auto;   
    background: #FFF8DC;   
    /*height: 420px;*/   
  }   
  .border{   
    /*border: 2px solid #000;*/   
    height: 200px;   
    margin-top: 1pc;   
    padding-bottom: 3pc;   
    padding-right: 2pc;   
  }   
  .undecor{   
    text-decoration: none;   
  }   
  .footer{   
    /*width: 90%;*/   
    margin: auto;   
    height: 40px;   
    line-height: 40px;   
    background: #F0EEEE;   
  }   
  .menu{   
    background-color: #F0EEEE;   
    height: 50px;   
    line-height: 50px;   
    /*position: relative;*/   
    /*width: 90%;*/   
    /*margin: 0;*/   
    /*padding:0;*/   
  }   
  .menu1{   
    background-color: #F0EEEE;   
    height: 60px;   
    line-height: 60px;   
    /*position: relative;*/   
    /*width: 90%;*/   
    margin: 0;   
    /*padding:0 auto;*/   
 .akun{  
  float: right;  
  border-left: 3px solid #ffffff;  
  }  
  }   
  .jarak{   
    padding: 0 2pc;   
  }   
  .menu ul{   
    list-style: none;   
  }   
  .menu ul li a{   
    float: left;   
    width: 14%;   
    display: block;   
    text-align: center;   
    color: #A4A4A4;   
    text-decoration: none;   
  }   
  .menu ul li a:hover{   
    background-color: #DDDCDC;   
    display:block;   
  }   
  .menu1 ul{   
    list-style: none;   
  }   
  .menu1 ul li a{   
    float: left;   
    width: 14%;   
    display: block;   
    text-align: center;   
    color: #A4A4A4;   
    text-decoration: none;   
  }   
  .menu1 ul li a:hover{   
    background-color: #FAF9F9;   
    display:block;   
  }   
  .kanan p{   
    font-size: 12px;   
    margin: 0;   
    text-align:center;   
    margin: 10px;    
    color:#D9D8D8;   
  }   
  h3{   
    font-family: "Lucida Console";   
    font-weight: bold;   
    font-size: 24px;   
  }   
  p{   
    font-family: "Verdana";   
    font-size: 14px;   
    font-weight: lighter;   
    color: #ADACAC;   
  }   
  h1{   
    font-family: "Verdana";   
    font-size: 13px;   
    font-weight: bold;   
    text-align: center;   
    padding-top: 10px;   
  }   
  h2{   
    font-family: "Lucida Console";   
    font-weight: lighter;   
    font-size: 12px;   
  }  

Hasil:

3. Source Code HTML

 <!DOCTYPE html>  
 <html>  
 <head>  
      <title>Sign Up</title>  
      <link rel="stylesheet" type="text/css" href="style1.css">  
 </head>  
 <body>  
      <center><h2>SIGN UP FOR FREE</h2></center>  
      <div class="login">  
           <form action="#" method="POST" onSubmit="validasi()">  
                <div>  
                     <label>Nama Lengkap:</label>  
                     <input type="text" name="nama" placeholder="Enter Your Name" id="nama" maxlength="50" required />  
                </div>  
                <div>  
                     <label>Alamat:</label>  
                     <textarea cols="40" rows="5" name="alamat" placeholder="Enter Your Address" id="alamat" required ></textarea>  
                </div>  
                <div>  
                     <label>Email:</label>  
                     <input type="email" name="email" placeholder="Enter E-mail"id="email" required />  
                </div>  
                <div>  
                     <label>No Hp:</label>  
                     <input type="phone" name="phone" placeholder="Enter Your Phone Number" id="phone" min="11" max="13" required/>  
                </div>  
                <div>  
                     <label>Jenis Kelamin: </label> <br/>  
                     <input type="radio" name="gender" value="male" /> L <br/>  
                     <input type="radio" name="gender" value="female" /> P <br/>  
                </div>  
                <div>  
     <label>Tanggal Lahir:</label>  
     <input type="date" id="birthday" name="birthday" id="birthday"  
         min="01-01-1900" max="31-12-2018" required />  
   </div>  
      <div>  
                     <label>Kolom Favorit:</label>  
                     <input type="text" name="fav" list="fav" placeholder="Teknologi,Olahraga, etc" required/>    
         <datalist id="fav">    
          <option value="Teknologi"></option>    
         <option value="Olahraga"></option>    
         <option value="Politik"></option>    
         <option value="Ekonomi"></option>    
         <option value="Lainnya"></option>    
         </datalist>    
                </div>  
                <div>  
                <label>Password:</label>  
                 <input type="text" placeholder="Enter Password" name="pass" required>   
                 </div>  
                <div>  
                     <input type="submit" value="Sign Up" class="tombol">  
                </div>  
           </form>  
      </div>  
 </body>  
 <script type="text/javascript">  
      function validasi() {  
           var nama = document.getElementById("nama").value;  
           var alamat = document.getElementById("alamat").value;  
           var email = document.getElementById("email").value;  
           var phone = document.getElementById("phone").value;  
           var gender = document.getElementById("gender").value;  
           var birthday = document.getElementById("birthday").value;  
           var fav = document.getElementById("fav").value;  
           var maxhuruf = 50;  
           pola_email=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;  
      if (!pola_email.test(form.email.value)){  
   alert ('Penulisan Email tidak benar');  
   form.email.focus();  
   return false;  
  }  
           if (form.nama.value.length > maxhuruf){  
   alert("Batas Maksimal adalah 50 Karakter");  
   form.nama.focus();  
   return (false);  
           }  
           if (nama = "" || email="" || alamat ="" || phone ="" || gender ="" || birthday ="" || fav ="") {  
                alert('Anda harus mengisi data dengan lengkap !');  
                return (false);}  
  }  
      }  
 </script>  
 </html>  

4. Source Code CSS

 body {  
  background: #FF7F50;  
  font-family: "lato", cursive, sans-serif;  
 }  
 h2 {  
  color: #fff;  
 }  
 .login {  
  padding: 1em;  
  margin: 2em auto;  
  width: 17em;  
  background: #fff;  
  border-radius: 3px;  
 }  
 label {  
  font-size: 10pt;  
  color: #555;  
 }  
 input[type="text"],  
 input[type="email"],  
 input[type="phone"],  
 input[type="date"],  
 textarea {  
  padding: 8px;  
  width: 95%;  
  background: #efefef;  
  border: 0;  
  font-family: "lato", cursive, sans-serif;  
  font-size: 10pt;  
  margin: 6px 0px;  
 }  
 .tombol {  
  background: #FF7F50;  
  color: #fff;  
  border: 0;  
  padding: 5px 8px;  
 }  
Hasil: