Selasa, 01 Maret 2011

Modul5_Form pemesanan





lha ituw tampilan form pemesanan pake dhtml n java script....btw nie punya spesifikasi lhow appan eah ???
Spesifikasi dari form ini yaitu :
- field harga, jumlah total, diskon dan jumlah dibayar bersifat read only (disabled).
- Jika field pesan diisi, maka otomatis field jumlah total akan menghitung jumlah total bedasarkan harga dan banyak pesanan yang dimasukkan.
- Field jumlah dibayar juga otomatis terisi berdasarkan perhitungan yang dilakukan.
- Jika pembelian lebih dari 50000 maka field diskon akan otomatis terisi dengan 10000 (tidak berlaku kelipatannya), dan ini nanti akan berpengaruh pada field jumlah dibayar karena nilainya akan berubah sesuai pengurangan diskon.
- Jika button CLEAR di klik maka semua field pesan, jumlah total, diskon dan jumlah dibayat akan dikosongkan.


Trus gimana eah code programnya????
nie lhow code programnya pake, nama file wilis.html
<!DOCTYPE html>
<PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"xml:lang="en"lang="en">

<head>
<title>Willys Poenya_Cafe</title>

<script language="JavaScript" type="text/JavaScript">

function hitungpesan() {
var note = document.form1;
var hargaBakso = parseInt(note.bakso.value) * parseInt(note.mybakso.value);
var hargaSoto = parseInt(note.soto.value) * parseInt(note.mysoto.value);
var hargaMie = parseInt(note.mie.value) * parseInt(note.mymie.value);
var hargaDegan = parseInt(note.degan.value) * parseInt(note.mydegan.value);
var hargaCampur = parseInt(note.campur.value) * parseInt(note.mycampur.value);

var hargaTotal= hargaBakso + hargaSoto + hargaMie + hargaDegan + hargaCampur;

if(hargaTotal>50000)
{
note.total.value = hargaTotal;
note.diskon.value = 10000;
note.bayar.value = hargaTotal - parseInt(note.diskon.value);
}
else
{
note.total.value = hargaTotal;
note.diskon.value = 0;
note.bayar.value = hargaTotal;
}
}

function hapus(){
document.form1.reset();
}

function keluar(){
document.form1.exit();
}
</script>
</head>


<font face = "kristen itc" size = "3" color ="orange" left= 600px;>
<h2 align="center">Daftar Pemesanan Willys Poenya _Cafe
<br>Berbasis DHtml dan JavaScript</h2></font></br>
<form name = "form1" action="#">
<table border="1" align="center">


<tr>
<td width="30" align="center" bgcolor="pink"><b>No</b></td>
<td width="200" align="center" bgcolor="pink"><b>Makanan/Minuman</b></td>
<td align="center" bgcolor="pink" ><b>Harga</b></td>
<td align="center" bgcolor="pink"><b>Pesan</b></td>
</tr>

<tr>
<td align="center" bgcolor="pink">1</td>
<td bgcolor="pink">Bakso Istimewa</td>
<td bgcolor="pink">@<input type="text" name="bakso" value="12000" disabled="true"/></td>
<td bgcolor="blue"><input type="text" name="mybakso" value="0" onkeyup="hitungpesan()" /></td>
</tr>

<tr>
<td align="center" bgcolor="pink">2</td>
<td bgcolor="pink">Soto Spesial</td>
<td bgcolor="pink">@<input type="text" name="soto" value="10000" disabled="true"/></td>
<td bgcolor="blue"><input type="text" name="mysoto" value="0" onkeyup="hitungpesan()"/></td>
</tr>

<tr>
<td align="center" bgcolor="pink">3</td>
<td bgcolor="pink">Mie Ayam Super</td>
<td bgcolor="pink">@<input type="text" name="mie" value="15000" disabled="true"/></td>
<td bgcolor="blue"><input type="text" name="mymie" value="0" onkeyup="hitungpesan()"/></td>
</tr>

<tr>
<td align="center" bgcolor="pink">4</td>
<td bgcolor="pink">Es Degan</td>
<td bgcolor="pink">@<input type="text" name="degan" value="5000" disabled="true"/></td>
<td bgcolor="blue"><input type="text" name="mydegan" value="0" onkeyup="hitungpesan()"/></td>
</tr>

<tr>
<td align="center" bgcolor="pink">5</td>
<td bgcolor="pink">Es Campur</td>
<td bgcolor="pink">@<input type="text" name="campur" value="7000" disabled="true"/></td>
<td bgcolor="blue"><input type="text" name="mycampur" value="0" onkeyup="hitungpesan()"/></td>
</tr>

<tr>
<td colspan="3" align="right" bgcolor="pink"><b>Jumlah Total</b></td>
<td bgcolor="blue"><input type="text" name="total" style="text-align:right" disabled="true"/></td>
</tr>

<tr>
<td colspan="3" align="right" bgcolor="pink"><b>Diskon</b></td>
<td bgcolor="blue"><input type="text" name="diskon" style="text-align:right" disabled="true"/></td>
</tr>

<tr>
<td colspan="3" align="right" bgcolor="pink"><b>Jumlah Dibayar</b></td>
<td bgcolor="blue"><input type="text" name="bayar" style="text-align:right" disabled="true"/></td>
</tr>

</table>
<br />

<p>
<font face = "kristen itc" size = "3" color ="purple" left= 600px;>
<br><input type="button" value="DELETE" onclick="hapus()" style="position:absolute; width:100px; height:30px; left: 600px; top: 400px; color : red;" /></br>
</font>
<body background="japan.jpg">
</p>

<font face = "kristen itc" size = "3" color ="purple" left= 600px;>
<h3 align="center" >my.Cafe @2011 Wilis Dwi Probowati Poenya</h3></font>

<a href="cliq.willys282.blogspot.com" color ="purple" left= 600px; >
<h4 align="center" >cliq.willys282.blogspot.com</h4></font>
</form>
</body>
</html>

Tidak ada komentar:

Posting Komentar