Postingan lainnya
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
perhitungan dengan javascript
mau buat seperti purchase order gan bisa multiple insert dan tambah row sesuai kebutuhan, didalam row bisa langsung action ketika jumlah barang * harga barang akan terlihat result nya
ini form nya gan
<div class="col-lg-12">
<div class="card">
<div class="card-header">DETAIL</div>
<div class="col-lg-12" style="overflow-y: auto;max-height: 530px;">
<table class="table table-hover table-fixed">
<thead>
<tr style="font-size:10px; text-align: center;">
<th>NO</th>
<th>NAMA BARANG</th>
<th>QTY</th>
<th>SATUAN</th>
<th>HARGA</th>
<th>JUMLAH</th>
<th>KETERANGAN</th>
</tr>
</thead>
<tbody>
<tr style="font-size: 10px;">
<td style="text-align: center">1</td>
<td><input type="text" name="nama_barang_purchase_requisition[]" ></td>
<td><input type="text" name="qty_barang_purchase_requisition[]" id="qty_barang" onkeyup="sum();"></td>
<td><input type="text" name="satuan_barang_purchase_requisition[]" ></td>
<td><input type="text" name="harga_barang_purchase_requisition[]" id="harga_barang" onkeyup="sum();" ></td>
<td><input type="text" id="hasil"></td>
<td><textarea name="keterangan_barang_purchase_requisition[]"></textarea></td>
</tr>
</tbody>
</table>
<div id="insert-form"></div>
<button type="button" id="btn-tambah-form" class="btn btn-primary btn-sm" style="margin-bottom:10px;">
<i class="fa fa-dot-circle-o"></i> ADD ITEM
</button>
<button type="button" id="btn-reset-form" class="btn btn-danger btn-sm" style="margin-bottom:10px;">
<i class="fa fa-dot-circle-o"></i> RESET ITEM
</button>
<input type="hidden" id="jumlah-form" value="1">
</div>
</div>
</div>
ini script untuk tambah row nya gan...nah problem nya sekarang pas di script ini trigger untuk kalkulasinya ga bisa tpi yang dipertama bisa
<script>
$(document).ready(function(){ // Ketika halaman sudah diload dan siap
$("#btn-tambah-form").click(function(){ // Ketika tombol Tambah Data Form di klik
var jumlah = parseInt($("#jumlah-form").val()); // Ambil jumlah data form pada textbox jumlah-form
var nextform = jumlah + 1; // Tambah 1 untuk jumlah form nya
// Kita akan menambahkan form dengan menggunakan append
// pada sebuah tag div yg kita beri id insert-form
$("#insert-form").append(
"<table class='table table-hover table-fixed'>" +
"<tbody>" +
"<tr style='font-size: 10px;' >" +
"<td style='text-align: center;'> " + nextform + "</td>" +
"<td><input type='text' name='nama_barang_purchase_requisition[]'></td>" +
"<td><input type='text' name='qty_barang_purchase_requisition[]' id='qty_barang' onkeyup='sum();'></td>" +
"<td><input type='text' name='satuan_barang_purchase_requisition[]' ></td>" +
"<td><input type='text' name='harga_barang_purchase_requisition[]' id='harga_barang' onkeyup='sum();'></td>" +
"<td><input type='text' id='hasil'></td>" +
"<td><textarea name='keterangan_barang_purchase_requisition[]'></textarea></td>" +
"</tr>" +
"</tbody>" +
"</table>"
);
$("#jumlah-form").val(nextform); // Ubah value textbox jumlah-form dengan variabel nextform
});
// Buat fungsi untuk mereset form ke semula
$("#btn-reset-form").click(function(){
$("#insert-form").html(""); // Kita kosongkan isi dari div insert-form
$("#jumlah-form").val("1"); // Ubah kembali value jumlah form menjadi 1
});
});
</script>
ini js untuk kalkulasi nya gan
<script>
function sum() {
var txtFirstNumberValue = document.getElementById('qty_barang').value;
var txtSecondNumberValue = document.getElementById('harga_barang').value;
var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
if (!isNaN(result)) {
document.getElementById('hasil').value = result;
}
}
</script>
0
2 Jawaban:
index arraynya gan blm dikasih, jadi qty_barang index keberapa yg sedang disum skrg
0