Wie aus jeder Zeile Daten Textfeld Wert in Array berechnen?

Question

Ich möchte die Gesamtsumme der Werte für jede Zeile Datenfeld zeigen. Ich habe 5 Datenreihen, ich möchte die Ergebnisse der einzelnen Daten erhalten. Kann mir jemand helfen, es herauszufinden?

function subtotal(konversi){ 
 
    var hitung = (document.getElementById('quantity').value * document.getElementById('packing_value').value); 
 
    document.forms.demoform.quantity_konversi.value = hitung; 
 
}

<form id='demoform'> 
 
<?php 
 
$jumlah=5; 
 
for($i=0; $i<$jumlah; $i++){ 
 
    $nomor = $i + 1; 
 

 
    echo"$nomor"; 
 
?> 
 

 
<input type='text' name='quantity[]' id='quantity' onchange="subtotal(this.value,getElementById('packing_value').value);"> 
 
X 
 
<input type='text' id="packing_value" value='10' readonly='yes'> 
 
<input type='text' name='quantity_konversi[]' id='quantity_konversi' placeholder='result ???'><br/> 
 

 
<?php } $nomor++ ?> 
 

 
</form>

Answer 1

Ihr Problem ist, dass alle Eingabefelder die gleiche ID haben. In HTML sollte jedes Element/HTML-Tag eine eindeutige ID haben. Wenn Sie also mit der ID referenzieren, wird JavaScript das erste Vorkommen Ihrer ID finden und dieses Element verwenden. Alle anderen Elemente werden ignoriert, obwohl sie dieselbe ID haben. Also erinnern IDs sind einzigartig, Klassen können für mehrere Elemente verwendet werden.

Ihr Problem zu lösen habe ich eine eindeutige ID am Ende der regulären quantity id mit der PHP-Variablen $nomor:

<input type='text' name='quantity[]' id='quantity<?php echo"$nomor"; ?>' onkeyup="subtotal();"> 

Der PHP-Server wird die folgende draus machen:

<input type='text' name='quantity[]' id='quantity1' onkeyup="subtotal();"> 
<input type='text' name='quantity[]' id='quantity2' onkeyup="subtotal();"> 
    ... 
<input type='text' name='quantity[]' id='quantity5' onkeyup="subtotal();"> 

Sie wissen, haben eine eindeutige ID, die von JavaScript mit Hilfe eines laufenden Index innerhalb einer for-Schleife referenziert werden kann:

document.getElementById('quantity'+i).value 

Das gleiche gilt für document.getElementById('packing_value'+i).value

Schließlich wird der berechnete Wert in dem richtigen Feld gespeichert wird:

document.getElementById('quantity_konversi'+i).value = hitung; 

FULL CODE (runnable bei http://phpfiddle.org/):

<script> 
     function subtotal(konversi){ 
      console.log('subtotal function'); 
      for(var i = 1; i < 5+1; i++){ 
       //console.log('quantity'+i, document.getElementById('quantity'+i).value); 
       //console.log('packing_value'+i, document.getElementById('packing_value'+i).value); 
       var hitung = (document.getElementById('quantity'+i).value * document.getElementById('packing_value'+i).value); 
       //document.forms.demoform.quantity_konversi.value = hitung; 
       document.getElementById('quantity_konversi'+i).value = hitung; 
       console.log(i, hitung); 
      } 
     } 
    </script> 
<form id='demoform'> 
<?php 
    $jumlah=5; 
    for($i=0; $i<$jumlah; $i++){ 
     $nomor = $i + 1;  
     echo"$nomor"; 
?> 

     <input type='text' name='quantity[]' id='quantity<?php echo"$nomor"; ?>' onkeyup="subtotal();"> 
     X 
     <input type='text' id="packing_value<?php echo"$nomor"; ?>" value='10' onkeyup="subtotal();"> 

     <input type='text' name='quantity_konversi[]' id='quantity_konversi<?php echo"$nomor"; ?>' placeholder='result ???'><br/> 
<?php 

    } //for end 
    $nomor++ 
?> 

</form>