Jquery select on change function

Kali ini bermain main dengan jquery select on change, bermain main dengan jquery itu ternyata menyenangkan juga, baru kali ini mulai belajar belajar lagi jquery. Kali ini saya ingin sharing tentang cara bagaimana bermain main dengan form dengan jquery, kali ini saya menggabungkan fungsi select dan input, jadi ketika kita memilih select option tertentu maka akan mempengaruhi input box dalam hal ini saya menggunakan class yang sudah ada di html yaitu class required dan disabled, langsung saja kira kira seperti ini scriptnya.

Pertama tama tentu saja kita sudah memastikan jquery sudah terload

https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js

Selanjutnya adalah membuat select dan input di html

<select id="metode" required name="metode" class="form-control">
 <option value="Cash">Cash</option>
 <option value="Debit">Debit</option>
 <option value="Kredit">Kredit</option>
</select>

 <select name="bank" id="bank" disabled class="form-control">
 <option value="">Pilih Bank</option>
 <option value="Mandiri">Mandiri</option>
 <option value="Danamon">Danamon</option>
 <option value="BRI">BRI</option>
 <option value="BNI">BNI</option>
 <option value="BCA">BCA</option>
 <option value="Bukopin">Bukopin</option>
 <option value="CIMB Niaga">CIMB Niaga</option>
 <option value="Mayapada">Mayapada</option>
 <option value="Muamalat">Muamalat</option>
 <option value="BTN">BTN</option>
 </select>

 <input id="kartu" name="kartu" disabled placeholder="Nomor Kartu" class="form-control" type="text">

Advertisement

Simple auto calculation for cart with jquery

Ya kali ini saya akan sharing cara membuat auto calculation jadi tinggal masukkan 2 input dan 1 perkalian, karena kebetulan sedang ada proyek kecil2an membuat perhitungan otomatis, berikut codingannya.

buat 3 input di html atau php terserah

<input type="text" id="txt1" onchange="sum();" name="" value="">

<input type="text" id="txt2" onchange="sum();" name="" value="">

<input type="text" id="txt3"  onchange="sum();" name="" value="">

<input type="text" id="txt4"   name="" value="">

 

lalu buat script seperti dibawah taruh dipaling bawah

function format2(n, currency) {
 return currency + " " + n.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1.");
 }

function sum() {
 var satu = document.getElementById('txt1').value;
 var dua = document.getElementById('txt2').value;
 var tiga = document.getElementById('txt3').value;
 var result = (parseInt(satu) + parseInt(dua)) * parseInt(tiga) ;

if (!isNaN(result)) {
 var hasil = format2(result,"Rp. ");
 document.getElementById('txt4').value = hasil;
 }
 }

Dah gitu aja selamat mencoba kalau sukses maka kita membuat penjumlah 2 produk di input1 dan input2 dan dikalikan dengan input3, kemudian hasilnya akan tampil di input 4.

Silahkan berimprovisasi bisa juga dibuat select seperti contoh diatas

Silahkan mencoba happy coding

My First Web Based Android Apps

Wow really intereseting and easy developed android apps web based using jquery mobile, this is the screenshot

 

 

This is the link http://jquerymobile.com/