NRP : 05111740000068
Kelas : Pemrograman Web C
Pada postingan saya kali ini saya akan membagikan hasil tugas membuat formulir tagihan dengan PHP. Berikut Screenshot dan source code dari gambar tersebut
1. Screenshot
2. Source Code
- index.php
<?php
session_start();
?>
<!DOCTYPE html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="wrapshopcart">
<h1>Form Registrasi</h1>
<p>Mohon lengkapi data tagihan anda pada form berikut ini! (*=wajib). </p>
<form action="tagihan.php" method="POST">
<label>Nama Depan* : </label><input type="text" name="nama_depan" class="inputan" required />
<br>
<br>
<label>Nama Belakang : </label><input type="text" name="nama_belakang" class="inputan" />
<br>
<br>
<label>Email* : </label><input type="email" name="email" class="inputan" required />
<br>
<br>
<label>No Pelanggan* : </label><input type="number" name="no_pel" class="inputan" required pattern=".{6,}" />
<br>
<br>
<label>No Telp : </label><input type="text" name="no_telp" class="inputan" />
<br>
<br>
<label>Alamat* :</label><textarea name="alamat" class="textan" required></textarea>
<input type="submit" name="kirim" value="Kirim Isi Formulir!" class="submitbtn" />
</form>
</div>
</body>
</html>
- tagihan.php
<?php
session_start();
$total = NULL;
$post = $_POST;
$_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)
);
$_SESSION['price'] = array(
'TL01' => 1600,
'BA01' => 6500,
'PJ01' => 3500
);
?>
<!DOCTYPE html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="wrapshopcart">
<h1>Invoice 637462i9</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>
</div>
</body>
</html>
- style.css
body
{
background:#fff;
font-family:arial;
}
#wrapshopcart
{
width:70%;
margin:3em auto;
padding:30px;
background:#efefef;
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;
};
Sekian postingan saya kali ini, terima kasih.
No comments:
Post a Comment