forループ内の3番目の入力フィールドに2つの入力フィールドの値を掛ける

Question

少し問題があります。 Forループ複数の3つの入力フィールドを作成しています（数量、レート、価格）私は「数量」 & 「レート」のIDを取得し、第三入力「価格」で製品を表示するのJavascript機能を使用しています。私の問題は、forループで、Id &を使用した場合に限り、1stレコードの製品が得られることです。残りの 'Price'入力はそれぞれ 'Quantity' & 'Rate'入力の製品をキャッチしません。複数の3つの入力を使ってこれをどのように処理するのですか？私を助けてください、私は非常に感謝します。

は、ここで入力エントリイメージ

を参照してください

HTMLコード：

<?php 
    $total = $total_entries; 
    for($i=0; $i<$total; $i++){ 
?> 
<div class="row"> 
    <div class="col-md-12"> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="item">Item</label> 
       <input type="text" class="form-control" name="item[]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="quantity">Quantity</label> 
       <input id="quantity" type="number" class="form-control" name="quantity[]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="rate">Rate</label> 
       <input id="rate" type="text" class="form-control" name="rate[]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="price">Price</label> 
       <input id="price" type="number" class="form-control" name="price[]"> 
      </div> 
     </div> 

     <?php } ?> 

    </div> 
</div> 

JavaScript関数：

<script> 
    $('#quantity, #rate').change(function(){ 
     var rate = parseFloat($('#quantity').val()) || 0; 
     var box = parseFloat($('#rate').val()) || 0; 
     $('#price').val(rate * box);  
    }); 
</script> 

Answer 1

これを試してみて、

<?php 
    $total = $total_entries; 
    for($i=0; $i<$total; $i++){ 
?> 
<div class="row"> 
    <div class="col-md-12"> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="item">Item</label> 
       <input type="text" class="form-control item" name="item[<?php echo $i; ?>]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="quantity">Quantity</label> 
       <input id="quantity_<?php echo $i; ?>" type="number" class="form-control quantity" name="quantity[<?php echo $i; ?>]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="rate">Rate</label> 
       <input id="rate_<?php echo $i; ?>" type="text" class="form-control rate" name="rate[<?php echo $i; ?>]"> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="form-group"> 
       <label for="price">Price</label> 
       <input id="price_<?php echo $i; ?>" type="number" class="form-control price" name="price[<?php echo $i; ?>]"> 
      </div> 
     </div> 

     <?php } ?> 

    </div> 
</div> 

のJavascript機能：

<script> 
    $('.quantity, .rate').change(function(){ 
     var rate = parseFloat($(this).closest(".row").find(".quantity").val()) || 0; 
     var box = parseFloat($(this).closest(".row").find(".rate").val()) || 0; 
     $(this).closest(".row").find(".price").val(rate * box);  
    }); 
</script> 

あなたはそれだけで一つの要素を考慮しますので、複数の要素に共通のIDを使用してではなく、必要な要素を考慮して、

Class同様の要素を特定することです。

Idは、要素を一意に識別する識別子です。