yang pertama membuat file javascriptnya
function jumlah(){
var total = parseInt(document.warung.total.value);
var diskonwarung = parseInt(document.warung.diskonwarung.value);
var bayar = total - diskonwarung;
document.warung.bayar.value = bayar;
}
function diskonwarung(){
var total = parseInt(document.warung.total.value);
var diskonwarung = 0;
if(total >= 100000){
diskonwarung = 20 / 100 * total;
}
else if(total >= 50000){
diskonwarung = 10 / 100 * total;
}
else if(total >= 25000){
diskonwarung = 5 / 100 * total;
}
document.warung.diskonwarung.value = diskonwarung;
}
function totalharga(){
var harga;
var makanan;
var total = 0;
for(i = 0; i < 10; i += 2){
harga = parseInt(document.warung[i].value);
makanan = parseInt(document.warung[i + 1].value);
if(makanan > 0){
total = total + (harga * makanan);
}
document.warung.total.value = total;
}
}
function reset(){
var elemen = document.warung;
elemen.bakso.value.clear()
elemen.soto.value.clear()
elemen.mieayam.value.clear()
elemen.esdegan.value.clear()
elemen.escampur.value.clear()
elemen.total.value.clear()
elemen.diskonwarung.value.clear()
elemen.jumlah.value.clear()
}
function operasi(){
totalharga();
diskonwarung();
jumlah();
}
Simpan dengan nama warung.js
Yang kedua adalah script dari file HTMLnya ...................................................................
<!DOCTYPE html>
<html lang="en">
<head>
<title>program warung</title>
<script language="JavaScript" type="text/javascript" src="warung.js"></script>
<link rel="stylesheet" type="text/css" href="style warung.css"/>
</head>
<body background="http://localhost/modul%205%20new/gfbceekpjcc.jpg">
<font size="12" face="monotype corsiva" color="yellow">Form Pemesanan Berbasis JavaScript</font>
<form name="warung" action="#">
<br>
<br>
<table border="4" bgcolor="white">
<tr>
<th>No</th>
<th>Makanan/Minuman</th>
<th>Harga</th>
<th>Pesan</th>
</tr>
<tr>
<td>1</td><td>Bakso Istimewa</td>
<td>@<input type="text" name="hrg1" value="12000" onchange="operasi()"/></td>
<td><input type="text" name="bakso" onchange="operasi()"/></td>
</tr>
<tr>
<td>2</td><td>Soto Spesial</td>
<td>@<input type="text" name="hrg2" value="10000" onchange="operasi()"/></td>
<td><input type="text" name="soto" onchange="operasi()"/></td>
</tr>
<tr>
<td>3</td><td>Mie Ayam Super</td>
<td>@<input type="text" name="hrg3" value="15000" onchange="operasi()"/></td>
<td><input type="text" name="mieayam" onchange="operasi()"/></td>
</tr>
<tr>
<td>4</td><td>Es Degan</td>
<td>@<input type="text" name="hrg4" value="5000" onchange="operasi()"/></td>
<td><input type="text" name="esdegan" onchange="operasi()"/></td>
</tr>
<tr>
<td>5</td><td>Es Campur</td>
<td>@<input type="text" name="hrg5" value="7000" onchange="operasi()"/></td>
<td><input type="text" name="escampur" onchange="operasi()"/></td>
</tr>
<tr>
<td colspan="3" align="center">Jumlah Harga</td>
<td><input type="text" name="total" readonly /></td>
</tr>
<tr>
<td colspan="3" align="center">Diskon</td>
<td><input type="text" name="diskonwarung" readonly /></td>
</tr>
<tr>
<td colspan="3" align="center">Jumlah bayar</td>
<td><input type="text" name="bayar" readonly /></td>
</tr>
</table>
<br>
<input type="button" name="RESET" value="RESET" onclick="reset()"/>
</form>
</body>
</html>
Simpan dengan Nama programwarung.html
Hasilnya adalaah ...

Tidak ada komentar:
Posting Komentar