Tugas PWEB - Form Pembayaran Listrik
Nama: Wisnu
NRP: 05111740000170
Kelas : PWEB C
File Index.php
File Tagihan.php
File invoice.php
Berikut adalah hasilnya:
NRP: 05111740000170
Kelas : PWEB C
File Index.php
<?php
session_start();
?>
<!DOCTYPE html>
<head>
<style type="text/css">
body
{
background:#efefef;
font-family:arial;
}
#wrapshopcart
{
width:70%;
margin:3em auto;
padding:30px;
background:#fff;
box-shadow:0 0 15px #ddd;
}
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:#000;
text-decoration:none;
margin:2em 0;
}
form
{
margin:2em 0 0 0;
}
label
{
display:inline-block;
width:12em;
}
input[type=text]
{
border:1px solid #bbb;
padding:10px;
width:30em;
}
textarea
{
border:1px 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:#eee;
color:#000;
text-decoration:none;
margin:0.5em 0 0 8em;
};
</style>
</head>
<body>
<div id="wrapshopcart">
<h1>Form Registrasi</h1>
<p>Silakan lengkapi form di bawah ini untuk membayar tagihan anda (*=wajib). </p>
<script type="text/javascript">
function validasi_input(form)
{
pola_email=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
pola_nopel=/^[0-9\_\-]{6,100}$/;
if (form.nama_depan.value == "")
{
alert("Nama anda masih kosong.");
form.nama_depan.focus();
return (false);
}
else if (!pola_email.test(form.email.value))
{
alert ('Penulisan Email tidak valid.');
form.email.focus();
return false;
}
else if (!pola_nopel.test(form.no_pel.value))
{
alert ('Nomor pelanggan terdiri dari 6 angka.');
form.no_pel.focus();
return false;
}
else if (form.alamat.value == "")
{
alert("Alamat anda masih kosong");
form.alamat.focus();
return (false);
}
return (true);
}
</script>
<form action="invoice.php" method="POST" onsubmit="return validasi_input(this)">
<label>Nama Depan* : </label><input type="text" name="nama_depan" class="inputan" />
<label>Nama Belakang : </label><input type="text" name="nama_belakang" class="inputan" />
<label>Email* : </label><input type="text" name="email" class="inputan" />
<label>No Pelanggan* : </label><input type="text" name="no_pel" class="inputan" />
<label>No Telp : </label><input type="text" name="no_telp" class="inputan" />
<label>Alamat* :</label><textarea name="alamat" class="textan"></textarea>
<input type="submit" name="kirim" value="Kirim Isi Formulir!" class="submitbtn" />
</form>
</div>
</body>
</html>
File Tagihan.php
<?php
session_start();
$total = NULL;
/* daftar transaksi nya dalam bentuk session */
$_SESSION['cart'] = array(
array('productid' => 'TL01', 'product' => 'Listrik yang terpakai (Kwh)' , 'qty' => 75.23 ),
array('productid' => 'BA01', 'product' => 'Biaya Administrasi' , 'qty' => 1),
array('productid' => 'PJ01', 'product' => 'Pajak' , 'qty' => 1)
);
/* daftar harga produknya */
$_SESSION['price'] = array(
'TL01' => 1600,
'BA01' => 6500,
'PJ01' => 3500
);
?>
<!DOCTYPE html>
<head>
<style type="text/css">
body
{
background:#efefef;
font-family:arial;
}
#wrapshopcart
{
width:70%;
margin:3em auto;
padding:30px;
background:#fff;
box-shadow:0 0 15px #ddd;
}
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:#000;
text-decoration:none;
margin:2em 0;
}
</style>
</head>
<body>
<div id="wrapshopcart">
<h1>Daftar Tagihan Listrik Anda</h1>
<p>Berikut adalah tagihan listrik anda bulan ini: </p>
<table>
<tr><th width="70%">Produk</th><th width="10%">Quantity</th><th width="20%">Jumlah</th></tr>
<?php foreach($_SESSION['cart'] as $row):?>
<?php
$jumlah = $_SESSION['price'][$row['productid']] * $row['qty'];
$total += $jumlah;
?>
<tr><td><?php echo $row['product'];?></td><td><?php echo $row['qty'];?></td><td><?php echo $jumlah; ?></td></tr>
<?php endforeach;?>
<tr class="total"><td></td><td >Total</td><td><?php echo $total;?></td></tr>
</table>
<a href="invoice.php" class="btnsubmit">Lanjut ke Pembayaran >></a>
</div>
</body>
</html>
File invoice.php
<?php
session_start();
$total = NULL;
$post = $_POST;
/* untuk invoice bisa di ambil dari database, karena pada dasarnya invoice tidak akan pernah recordnya itu di delete */
/* berapa jumlah invoice kemudian di tambahkan 1 */
$numrows_invoice_db = 565;
$invoice = $numrows_invoice_db + 7;
?>
<!DOCTYPE html>
<head>
<style type="text/css">
body
{
background:#efefef;
font-family:arial;
}
#wrapshopcart
{
width:70%;
margin:3em auto;
padding:30px;
background:#fff;
box-shadow:0 0 15px #ddd;
}
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:#000;
text-decoration:none;
margin:2em 0;
}
form
{
margin:2em 0 0 0;
}
label
{
display:inline-block;
width:auto;
}
input[type=text]
{
border:1px solid #bbb;
padding:10px;
width:30em;
}
textarea
{
border:1px 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:#eee;
color:#000;
text-decoration:none;
margin:0.5em 0 0 8em;
}
</style>
</head>
<body>
<div id="wrapshopcart">
<h1>Invoice <?php echo $invoice;?></h1>
<p>Silahkan save halaman ini. </p>
<h3>Berikut adalah data lengkap Anda : </h3>
</label><table><tr></tr></table>
<label>Nama Lengkap : <?php echo $post['nama_depan'] . ' ' . $post['nama_belakang'] ;?> </label><table><tr></tr></table>
<label>Email : <?php echo $post['email'] ;?> </label></label><table><tr></tr></table>
<label>No Pelanggan: <?php echo $post['no_pel'] ;?></label></label><table><tr></tr></table>
<label>No Telp : <?php echo $post['no_telp'] ;?></label></label><table><tr></tr></table>
<label>Alamat : <?php echo $post['alamat'] ;?></label></label><table><tr></tr></table>
<h3>Total tagihan anda: </h3>
<table>
<tr><th width="70%">Produk</th><th width="10%">Quantity</th><th width="20%">Jumlah</th></tr>
<?php foreach($_SESSION['cart'] as $row):?>
<?php
$jumlah = $_SESSION['price'][$row['productid']] * $row['qty'];
$total += $jumlah;
?>
<tr><td><?php echo $row['product'];?></td><td><?php echo $row['qty'];?></td><td><?php echo $jumlah; ?></td></tr>
<?php endforeach;?>
<tr class="total"><td></td><td >Total</td><td><?php echo $total;?></td></tr>
</table>
<h3>Silahkan Lakukan Pembayaran Ke Kantor PLN terdekat</h3>
<p>Hati-hati di jalan, jangan ngebut.</p>
</div>
</body>
</html>
Berikut adalah hasilnya:
Komentar
Posting Komentar