テーブルのonkeyup要素に基づく合計テーブル列TD

Question

私は各行ラベルを自動的に更新するonkeyupメソッドを持っています。表の最後には自動的に合計を更新するラベルマークアップがあります。私はここで

は私のコード

<table class="display" cellspacing="0" width="100%" id="paymentTable"> 
    <thead> 
    <th style="width: 1%;">NO</th> 
    <th style="width: 30%;">MATA UANG</th> 
    <th>RATE</th> 
    <th>SETORAN</th> 
    <th>TOTAL IDR</th> 
    </thead> 
    <tbody> 
    <?php 
    $i = 1; 
    while ($row = $result->fetch_array()) { 
     echo "<tr>"; 
     echo "<td style='width: 1%; '>$row[curr_id]</td>"; 
     echo "<td>$row[curr_code] - $row[curr_desc]</td>"; 
     echo "<td><input type='hidden' value='$row[conv_rate]' id='convRate$i'>$row[conv_rate]</td>"; 
     echo "<td><input type='text' onkeyup='processCurr($i);' id='inputCurr$i'/></td>"; 
     echo "<td><label id='calculatedCurr$i' class='calculatedCurr'></label></td>"; 
     echo "</tr>"; 
     $i++; 
    } 
    ?> 
    </tbody> 
</table><br/> 
TOTAL = <label id='totalSumPayment'></label> 

と私のjavascriptの、

私の問題がある

<script> 
    $('#paymentTable').dataTable(); 
    function processCurr(param){  
     var inputcurr= $('#inputCurr'+param).val(); 
     var conversion = $('#convRate'+param).val(); 
     $('#calculatedCurr'+param).html(inputcurr * conversion); 
     calculateSum(); 
    } 

    function calculateSum(){ 
     var sum = 0; 
     //iterate through each textboxes and add the values 
     $(".calculatedCurr").each(function() { 
      //add only if the value is number 
      if (!isNaN(this.value) && this.value.length != 0) { 
       sum += parseFloat(this.value); 
//    $(this).css("background-color", "#FEFFB0"); 
      } 
      else if (this.value.length != 0){ 
//    $(this).css("background-color", "red"); 
      } 
     }); 

    $("#totalSumPayment").val(sum.toFixed(2)); 
    } 
</script> 

、calculateSum（）doesnのある、列の和として、最終的なラベルを更新し、問題が生じています<label>に値が表示されないため、期待どおりに動作しません。そして私はerror = TypeErrorを取得しています：this.valueはファイアバグで未定義です。助けてください....

Answer 1

thisは特定の要素を指していません。 $.each関数のパラメータを使用する必要があります。

 $(".calculatedCurr").each(function(key, value) { 
     //add only if the value is number 
     if (!isNaN(value) && value.length != 0) { 
      sum += parseFloat(value); 
//    $(key).css("background-color", "#FEFFB0"); 
     } 
     else if (value.length != 0){ 
//    $(key).css("background-color", "red"); 
     } 
     }); 

Answer 2

コードに問題があります。

//iterate through each textboxes and add the values 
     $(".calculatedCurr").each(function() { 
      //add only if the value is number 
      if (!isNaN(this.value) && this.value.length != 0) { 
       sum += parseFloat(this.value); 
//    $(this).css("background-color", "#FEFFB0"); 
      } 
      else if (this.value.length != 0){ 
//    $(this).css("background-color", "red"); 
      } 
     }); 

はここ .calculatedCurr要素がboxes.Theyはあなたに正しいvalue.The正しい値を取得することはありませんlabels.So this.valueが .calculatedCurr要素の内部HTMLであるしているテキストされていません。