Nama: Ayu Mutiara Sari
NRP: 05111740000149
Kelas: PWEB C
Link: ini linknya
source code index.php:
source code invoice.php:
hasil:
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:
0 komentar:
Posting Komentar