Dalam postingan kali ini saya akan mebahas sedikit tentang penggunaan script javascript. Dengan javascript saya mencoba membuat sebuah form penjualan tiket Kereta Api. Namun disini saya hanya mengshare scriptnya saja, dengan kata lain tidak akan membahas function dari script tersebut. Semoga contoh ini dapat menambah ilmu bagi pembaca mengenai javascript.
Berikut ini merupakan script javascript pembuatan form penjualan tiket:
<html>
<head>
<title>praktikum9</title>
</head>
<body>
<script type="text/javascript">
function hitungtotal(){
var nama = (document.form.inama.value);
var tujuan = (document.form.itujuan.value);
var jumlahpaket = parseFloat (document.form.ijumlah.value);
var ht = 0.0 ;
var sub = 0.0;
var diskon = 0.0;
var total = 0.0;
if (tujuan == "Jakarta") {
ht = 10000;
}
else if(tujuan == "Yogyakarta")
{
ht = 5000;
}
else
{
ht = 20000;
}
sub = jumlahpaket*ht;
if (document.form.imamber.checked == true)
{
diskon = 0.10 * sub;
}
else
{
diskon=0.0;
}
total = sub - diskon;
document.form.otiket.value=eval(ht);
document.form.osub.value=eval(sub);
document.form.odiskon.value=eval(diskon);
document.form.ototal.value=eval(total);
}
</script>
<form name="form" onchange="hitungtotal()">
<table>
<tr>
<td>
<h2>Form Penjualan Tiket</h2>
</td>
</tr>
<tr>
<td>Nama</td>
<td><input type="text" name="inama" size="25" placeholder="Nama Anda.."> </td>
</tr>
<tr>
<td>
Tujuan
</td>
<td>
<select name="itujuan">
<option value="Jakarta">Jakarta</option>
<option value="Yogyakarta">Yogyakarta</option>
<option value="Semarang">Semarang</option>
</select>
</td>
</tr>
<tr>
<td>
Jumlah Tiket
</td>
<td>
<input type="text" size="15" name="ijumlah" placeholder="Jumlah Tiket Anda..">
</td>
</tr>
<tr>
<td>
Member
</td>
<td>
<input type="checkbox" name="imamber">Ya
</td>
</tr>
<tr>
<td>
Harga Tiket
</td>
<td>
<input type="text" size="10" name="otiket">
</td>
</tr>
<tr>
<td>
Sub Total
</td>
<td>
<input type="text" size="10" name="osub">
</td>
</tr>
<tr>
<td>
Diskon
</td>
<td>
<input type="text" size="10" name="odiskon">
</td>
</tr>
<tr>
<td>
Total Bayar
</td>
<td>
<input type="text" name="ototal" size=10"">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" value="Hitung" Onclick="hitungtotal()">
<input type="reset" value="Ulangi" >
</td>
</tr>
</table>
</form>
</body>
</html>
Diatas sudah saya bedakan dengan warna tulisanya mana bagian dalam perumusan dengan javascript dan mana yang merupakan pemanggil dari function-function tersebut. Dalam form ini jika dia member maka penjumlahan akan dilakukan secara otomatis sedangkan nonmember dilakukan dengan cara manual yaitu dengan cara mengklick hitung.
Untuk selebihnya bisa anda pelajari sendiri bagaimana cara kerjanya.
wassalamualaikum...
4 Komentar
terima kasih informasinya,,,semoga ALLAH SWT. membalas dengan kebaikan yang lebih dar info yg disebar.amiin
BalasHapusterimakasih untuk artikelnya.. Lanjutkan!
BalasHapusterimakasih untuk artikelnya..
BalasHapusMy blog
CrownQQ Agen DominoQQ BandarQ dan Domino99 Online Terbesar
BalasHapusYuk Buruan ikutan bermain di website CrownQQ
Sekarang CROWNQQ Memiliki Game terbaru Dan Ternama loh...
10 permainan :
=> Poker
=> Bandar Poker
=> Domino99
=> BandarQ
=> AduQ
=> Sakong
=> Capsa Susun
=> Bandar 66
=> Perang Baccarat
=> Perang dadu (NEW GAME)
Promo Yang berlaku
=> Bonus Refferal 20%
=> Bonus Turn Over 0,5%
=> Minimal Depo 20.000
=> Minimal WD 20.000
=> 100% Member Asli
=> Pelayanan DP & WD 24 jam
=> Livechat Kami 24 Jam Online
=> Bisa Dimainkan Di Hp Android
=> Di Layani Dengan 5 Bank Terbaik
=> 1 User ID 10 Permainan Menarik
=> Menyediakan deposit Via Pulsa
Link Resmi CrownQQ:
- hokicrown.com
- hokicrown.net
- hokicrown.org
Info Lebih lanjut Kunjungi :
Website : CrownQQ
WHATSAPP : +6287771354805
Line : CS_CROWNQQ
Facebook : CrownQQ Official
Kemenangan CrownQQ : Agen BandarQ