Ticker

6/recent/ticker-posts

Form Penjualan Tiket Dengan JavaScript

Form Penjualan Tiket dengan JavaScript
Assalamualaikum...

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...

Posting Komentar

4 Komentar

  1. terima kasih informasinya,,,semoga ALLAH SWT. membalas dengan kebaikan yang lebih dar info yg disebar.amiin

    BalasHapus
  2. terimakasih untuk artikelnya.. Lanjutkan!

    BalasHapus
  3. CrownQQ Agen DominoQQ BandarQ dan Domino99 Online Terbesar

    Yuk 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

    BalasHapus