Minggu, 27 Maret 2011

Modul 5 - Tugas Rumah


Berikut adalah script2nya :



1. Script HTML :

<!DOCTYPE HTML>
<html lang="en">

<head>
<title>TR MODUL 5</title>
<script language="JavaScript" type="text/javascript" src="jsonly.js"></script>
<link rel="stylesheet" href="cssonly.css" type="text/css" />
<link rel="icon" type="image/x-icon" href="strawberry-desserts-large.jpg">
</head>

<body>

<header>
<h2 align="center">SPECIAL SROBERY LUPH</h2>
</header>

<section>
<form name="form_pujas" action="#">
<table border=3 cellpadding=3>
<tr>
<th><div class="tabel1">No.<div></th>
<th width = 350px ><div class="tabel1">Cake and Escrim </div></th>
<th width = 120px ><div class="tabel1">Harga</div></th>
<th width = 100px><div class="tabel1">Pesan</div></th>
</tr>
</section>
<tr>
<td><div class="inputan">1</div></td>
<td><div class="inputan">Cake Toping Stobery Luph</div></td>
<td><div class="inputan">@ Rp <input type="text" name="harga1" value="15000" size="6" style="text-align:right" readonly /></div></td>
<td><div class="inputan"><input type="text" name="pesan1" value="0" size="3" onChange ="proses()"/> plate</div></td>
</tr>

<tr>
<td><div class="inputan">2</div></td>
<td><div class="inputan">Srobery Float Luph </td>
<td><div class="inputan">@ Rp <input type="text" name="harga2" value="15000" size="6" size="6" style="text-align:right" readonly /></div></td>
<td><div class="inputan"><input type="text" name="pesan2" value="0" size="3" onChange ="proses()" /> mug</div></td>
</tr>

<tr>
<td><div class="inputan">3</div></td>
<td><div class="inputan">Special Mini Strobery Tart</div></td>
<td><div class="inputan">@ Rp <input type="text" name="harga3" value="15000" size="6" style="text-align:right" readonly /></div></td>
<td><div class="inputan"><input type="text" name="pesan3" value="0" size="3" onChange ="proses()" /> plate</div></td>
</tr>

<tr>
<td><div class="inputan">4</div></td>
<td><div class="inputan">Special Strobery Snow</div></td>
<td><div class="inputan">@ Rp <input type="text" name="harga4" value="10000" size="6" style="text-align:right" readonly /></div></td>
<td><div class="inputan"><input type="text" name="pesan4" value="0" size="3" onChange ="proses()" /> mug</div></td>
</tr>

<tr>
<td><div class="inputan">5</div></td>
<td><div class="inputan">Es Crim Strobery Luph </div></td>
<td><div class="inputan">@ Rp <input type="text" name="harga5" value="10000" size="6" style="text-align:right" readonly /></div></td>
<td><div class="inputan"><input type="text" name="pesan5" value="0" size="3" onChange ="proses()" /> mug</div></td>
</tr>

<tr>
<td colspan=3><div class="tabel2">Jumlah</div></td>
<td><div class="tabel2">Rp <input type="text" size="6" style="text-align:right" name="JumTotal" readonly /></div></td>
<tr>

<tr>
<td colspan=3><div class="tabel2">Diskon</div></td>
<td><div class="tabel2">Rp <input type="text" size="6" style="text-align:right" name="Diskon" readonly /></div></td>
<tr>

<tr>
<td colspan=3><div class="tabel2">Jumlah Dibayar</div></td>
<td><div class="tabel2">Rp <input type="text" size="6" style="text-align:right" name="JumBayar" readonly /></div></td>
<tr>

</table>

<br>
<input type="button" name="batal" value="Batal" onclick="reset()"/>
<input type="submit" value="Pesan" onclick="pesan_sekarang()" />
</form>
</section>

<footer>
mianapti.blogspot.com ™
</footer>

</body>
</html>



2. Script CSS :

body {
margin: 15px auto;
width: 600px;
background-image: url(strawberry-desserts-large.jpg);
}

header,section,footer{
display:block;
border:10px solid magenta;
}

header{
font-family: Arial;
font-size: 15px;
font-weight:bold;
text-align: center;
color: white;
float:center;
height:50px;
background : indigo;
}

section{
padding: 10px;
height:350px;
background : white;
}

footer{
clear:both;
height:20px;
background : indigo;
font-family: Arial;
color : black;
font-size: 15px;
font-weight:bold;
}
.inputan{
font-family: Arial Narrow;
font-size: 15px;
text-align: center;
color: black;
float:left;
}
.tabel1{
font-family: Arial;
font-size: 15px;
font-weight:bold;
text-align: center;
color: black;
float:center;
}

.tabel2{
font-family: arial;
font-size: 15px;
font-weight:bold;
text-align: center;
color: black;
float:right;
}



3. Script JAVA SCRIPTnya :

function JumlahTotal(){

var myForm=document.form_pujas;
var total1;
var total2;
var total3;
var total4;
var total5;

total1 =parseInt(myForm.harga1.value) * parseInt(myForm.pesan1.value);
total2 =parseInt(myForm.harga2.value) * parseInt(myForm.pesan2.value);
total3 =parseInt(myForm.harga3.value) * parseInt(myForm.pesan3.value);
total4 =parseInt(myForm.harga4.value) * parseInt(myForm.pesan4.value);
total5 =parseInt(myForm.harga5.value) * parseInt(myForm.pesan5.value);

myForm.JumTotal.value=total1+total2+total3+total4+total5;
}

function potongan(){
var myForm=document.form_pujas;

if (myForm.JumTotal.value <= 50000){
myForm.Diskon.value = 0;
}
if (myForm.JumTotal.value <= 100000){
myForm.Diskon.value = 10000;
}
else{
myForm.Diskon.value = 20000;
}
}

function JumlahBayar(){
var myForm=document.form_pujas;

myForm.JumBayar.value = myForm.JumTotal.value - myForm.Diskon.value ;
}

function proses(){
JumlahTotal();
potongan();
JumlahBayar();
reset();
}

function reset(){
var elemen = document.pemesanan;

elemen.pesan1.value = "";
elemen.pesan2.value = "";
elemen.pesan3.value = "";
elemen.pesan4.value = "";
elemen.pesan5.value = "";
elemen.total.value = "";
elemen.diskon.value = "";
elemen.bayar.value = "";
}

function pesan_sekarang()
{
var myForm = document.form_pujas;
if (myForm.JumBayar.value=="" || myForm.JumBayar.value==0)
{
alert("Silakan pilih menu terlebih dahulu!");
}
else
{
alert("Terima kasih, total biaya Rp" + myForm.JumBayar.value + "..Kepuasan Anda Adalah Kebanggaan Kami ");
}
}
Diposting oleh di

Tidak ada komentar:

Posting Komentar

anybody yang mau komentar no problem, gak masalah smua .

monggo komentar. . . . .

Langganan: Posting Komentar (Atom)