Ini adalah formulir saya yang ada di dalam loop foreach. Saya ingin menampilkan produk dari dua input yaitu "qty" dan "uprice" tetapi satu-satunya hasil yang saya dapatkan adalah baris pertama yang saya masukkan.

Formulir

   <tbody>
    <?php foreach($_POST['porder'] as $porder): ?>
     <tr>
      <td>
            <input type="text" id="itemnum" name="itemnum" max=999 class="form-control form-control-line">
      </td>
      <td>
            <?php echo $porder ; ?>
      </td>
      <td>
            <input style="text-transform:uppercase"  type="text" id="rev" name="rev" class="form-control form-control-line" required>
      </td>
      <td>
            <input  style="text-transform:uppercase" type="text" id="desc" name="desc" class="form-control form-control-line" required>
      </td>
      <td>
            <input type="number" id="qty<?=$porder?>" name="qty[]" min="1" class="form-control form-control-line" onkeyup="compute('<?=$porder?>')" required>
      </td>
      <td>
            <input type="number" id="uprice<?=$porder?>" name="uprice[]" min="1" class="form-control form-control-line" onkeyup="compute('<?=$porder?>')" required>
      </td>
      <td>
            <input type="number" id="amount<?=$porder?>" name="amount[]" onkeyup="stotal('<?=$porder?>')" class="form-control form-control-line" >
      </td>
      </tr>

<?php endforeach ?>
<tr>
    <td colspan="5" ></td>  
    <td><strong>Total
    </td>
    <td>
    <input type="number" id="total" name="total"  class="form-control">
    </td>
</tr>

JavaScript


<script>
    function compute() {
      var txtFirstNumberValue = document.getElementById('qty').value;
      var txtSecondNumberValue = document.getElementById('uprice').value;
      var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
      if (!isNaN(result)) {
        document.getElementById('amount').value = result;
  }
}
</script>

Total ini adalah kode yang saya gunakan untuk menghitung jumlah total tetapi tidak menunjukkan hasilnya.

        var amount = document.getElementsByName('amount[]').value;
        var sum = 0;
        for (var i = 0; i <amount.length; i++) {
        var input_value=amount[i];
        sum +=parseInt(input_value.value);
        document.getElementById('total').value = sum;

    }
</script>
-1
Jiar 29 Oktober 2019, 11:26

4 jawaban

Jawaban Terbaik

Ubah kode Anda menjadi di bawah kode ini. Anda akan mendapatkan hasil yang benar. '$product_id' berarti id produk Anda dari tabel database Anda. yang otomatis bertambah.

Formulir

<tbody>
    <?php foreach($_POST['porder'] as $porder): ?>
     <tr>
      <td>
            <input type="text" id="itemnum" name="itemnum" max=999 class="form-control form-control-line">
      </td>
      <td>
            <?php echo $porder ; ?>
      </td>
      <td>
            <input style="text-transform:uppercase"  type="text" id="rev" name="rev" class="form-control form-control-line" required>
      </td>
      <td>
            <input  style="text-transform:uppercase" type="text" id="desc" name="desc" class="form-control form-control-line" required>
      </td>
      <td>
            <input type="number" id="qty<?=$product_id?>" name="qty" min="1"  class="form-control form-control-line" onkeyup="compute(<?=$product_id?>)" required>
      </td>
      <td>
            <input type="number" id="uprice<?=$product_id?>" name="uprice" min="1" class="form-control form-control-line" onkeyup="compute(<?=$product_id?>)" required>
      </td>
      <td>
            <output type="number" id="amount<?=$product_id?>" name="amount" class="form-control form-control-line" >
      </td>
      </tr>

<?php endforeach ?>

Kode Javascript

<script>
    function compute(id) {
      var txtFirstNumberValue = document.getElementById('qty'+id).value;
      var txtSecondNumberValue = document.getElementById('uprice'+id).value;
      var result = parseInt(txtFirstNumberValue) * parseInt(txtSecondNumberValue);
      if (!isNaN(result)) {
        document.getElementById('amount'+id).value = result;
  }
}
</script>
0
Jiar 6 November 2019, 04:58

Ini akan memperbaiki masalah Anda. Ubah nilai input, Anda akan mendapatkan hasilnya.

function calc(){
var qty = document.getElementsByName('qty[]');
var sum = 0;
for (var i = 0; i <qty.length; i++) {
var input_value=qty[i];
//        alert("First Index of Array :  qty["+i+"].value= "+input_value.value);
    var signle_value_input = input_value.value;
    if(signle_value_input.length!=0)
    sum +=parseInt(input_value.value);
}
$("#sum").html("Sum is "+sum);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="sum"></div>
<input name="qty[]" id="qty1" type="number" value="" onkeyup="calc()">
<input name="qty[]" id="qty2" type="number" value="" onkeyup="calc()">
<input name="qty[]" id="qty3" type="number"  value="" onkeyup="calc()" >
0
Kaleemullah 6 November 2019, 02:54
var qty = document.getElementsByName('qty[]');
var sum = 0;
for (var i = 0; i <qty.length; i++) {
var input_value=qty[i];
    alert("First Index of Array :  qty["+i+"].value= "+input_value.value);
    sum +=parseInt(input_value.value);
}
alert("Sum is "+sum);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input name="qty[]" id="qty1" type="number" value="1">
<input name="qty[]" id="qty2" type="number" value="3" >
<input name="qty[]" id="qty3" type="number"  value="4" >
0
Kaleemullah 4 November 2019, 07:27
var qty = document.getElementsByName('qty[]');
for (var i = 0; i <qty.length; i++) {
var input_value=qty[i];
    alert("First Index of Array :  qty["+i+"].value= "+input_value.value);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input name="qty[]" id="qty1" type="number" value="1">
<input name="qty[]" id="qty2" type="number" value="3" >
<input name="qty[]" id="qty3" type="number"  value="4" >
0
Kaleemullah 1 November 2019, 16:05