javascriptの入力を解析する

Question

私は学校カード用のテーブルを持っています。目標は平均グレーディング期間を表示することです。平均結果はデー​​タベースからのもので、平均結果はjavascriptからのものです。私の現在のコードでは、エラーを生成します。e.text（）は関数ではありません.Basically sum変数は、parseInt.Anyoneから値をキャッチしませんでした。この問題を解決するアイデアはありますか？

******サンプルの結果******

Subject | Col1 |Col2 |Col3 |Col4 
    1   80 80 86 80  (80+80+86+80)/4 Note: not this way 
    2   86 85 86 81 
    3   80 87 85 86 

    Result  82 84 and so on.. 
    It should be: 
    (80+86+80)/3 number of rows 

view.blade.php

<tr> 
    <th colspan="3">Subjects</th> 
    <th colspan="2">First Grading</th> 
    <th colspan="2">Second Grading</th> 
    <th colspan="2">Third Grading</th> 
    <th colspan="2">Fourth Grading</th> 

</tr> 
</thead> 
<tbody> 
     @foreach($update_card['AllGrade'] as $subject) 
     {!! Form::hidden('grade_id[]',$subject['grade_id']) !!} 
<tr> 
<td colspan="3">{!! $subject->subject !!}</td> 
<td colspan="2"><input type="text" name="term_1[]" value="{!! $subject->term_1 !!}" class="form-control number-only"></td> 
<td colspan="2"><input type="text" name="term_2[]" value="{!! $subject->term_2 !!}" class="form-control number-only"></td> 
<td colspan="2"><input type="text" name="term_3[]" value="{!! $subject->term_3 !!}" class="form-control number-only"></td> 
<td colspan="2"><input type="text" name="term_4[]" value="{!! $subject->term_4 !!}" class="form-control number-only"></td> 
<td class="ave" value="0"></td> 
</tr> 
     @endforeach 

<tr id="average"> 
<td colspan="3">Average</td><td colspan="2">0</td> <td colspan="2">0</td> <td colspan="2">0</td> <td colspan="2">0</td> 
</tr> 
</tbody> 

ここではJavaScript

$("input").on("keyup", function() { 
     $("tbody tr").each(function(index) { 
       var sum = 0; // The summation of all terms. 
       var card = 0; // Number of cells. 
       $(this).children('td').not(':first').each(function(i, e) { 
        card++; 
        sum+= parseInt(e.text().trim()); //this is the error 
       }); 
       var avg = sum/card; 
       console.log(avg); 
       $("#average td:nth-of-type("+index+")").html(avg); 
     }); 
}); 

Answer 1

私が指摘したようにあなたtdsをループし、それには何のテキストを持っていないながら、あなたがいないのTDテキスト入力値を取得する必要があるので、それ が入力した... text()を取得

ので、あなたが何かを試すことができますこの

ように私は、TD番号によって行平均を得るために、列、行番号によって平均とrow_Average()を得るために、column_Average()の列を合計する行、column_sum()を合計するrow_sum()ための関数を作成します。

$(document).ready(function(){ 
 
    $("input").on("keyup", function() { 
 
    //row_sum();  // for sum row 
 
    //column_sum(); // for sum column 
 
    column_Average(); // for column average 
 
    row_Average(); // for row average 
 
    }).keyup(); // by adding .keyup() your code will run onload 
 
}); 
 

 

 

 
function column_sum(){ 
 
    var sum = []; // The summation of all terms. 
 
    $("tbody tr:not(#average)").each(function(index) { 
 
    var thisIt = $(this); 
 
     thisIt.find('td:not(.ave)').not(':first').each(function(i) { 
 
     var input_val = ($.trim($(this).find('input').val())) ? $(this).find('input').val().trim() : 0; 
 
     sum[i] ? sum[i] += parseInt(input_val) : sum.push(parseInt(input_val)); 
 
    }); 
 
    }); 
 
    $('#average td:not(:first)').each(function(i){ 
 
    $(this).text(sum[i]); 
 
    }); 
 
} 
 
function row_sum(){ 
 
    $("tbody tr:not(#average)").each(function(index) { 
 
    var thisIt = $(this); 
 
    var sum = 0; // The summation of all terms. 
 
    thisIt.find('td').not(':first').not(':last').each(function(i) { 
 
      var input_val = ($.trim($(this).find('input').val())) ? $(this).find('input').val().trim() : 0; 
 
      sum += parseInt(input_val); 
 
    }); 
 
    thisIt.find('td.ave').text(sum); 
 
    }); 
 
} 
 

 
function column_Average(){ 
 
    var sum = []; // The summation of all terms. 
 
    var tr_num = $("tbody tr:not(#average)").length; 
 
    $("tbody tr:not(#average)").each(function(index) { 
 
    var thisIt = $(this); 
 
     thisIt.find('td:not(.ave)').not(':first').each(function(i) { 
 
     var input_val = ($.trim($(this).find('input').val())) ? $(this).find('input').val().trim() : 0; 
 
     sum[i] ? sum[i] += parseInt(input_val) : sum.push(parseInt(input_val)); 
 
    }); 
 
    }); 
 
    $('#average td:not(:first)').each(function(i){ 
 
    $(this).text(sum[i]/tr_num); 
 
    }); 
 
} 
 

 

 
function row_Average(){ 
 
    $("tbody tr:not(#average)").each(function(index) { 
 
    var thisIt = $(this); 
 
    var sum = 0; // The summation of all terms. 
 
    var code = 0; thisIt.find('td').not(':first').not(':last').each(function(i) { 
 
      var input_val = ($.trim($(this).find('input').val())) ? $(this).find('input').val().trim() : 0; 
 
      code++; 
 
      sum += parseInt(input_val); 
 
    }); 
 
    thisIt.find('td.ave').text(sum/code); 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
<thead> 
 
<tr> 
 
    <th colspan="3">Subjects</th> 
 
    <th colspan="2">First Grading</th> 
 
    <th colspan="2">Second Grading</th> 
 
    <th colspan="2">Third Grading</th> 
 
    <th colspan="2">Fourth Grading</th> 
 
    <th>Average</th> 
 
</tr> 
 
</thead> 
 
<tbody> 
 
<tr> 
 
<td colspan="3">Subject</td> 
 
<td colspan="2"><input type="text" name="term_1[]" value="12" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_2[]" value="13" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_3[]" value="14" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_4[]" value="15" class="form-control number-only"></td> 
 
<td class="ave" value="0"></td> 
 
</tr> 
 

 
<tr> 
 
<td colspan="3">Subject</td> 
 
<td colspan="2"><input type="text" name="term_1[]" value="120" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_2[]" value="130" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_3[]" value="140" class="form-control number-only"></td> 
 
<td colspan="2"><input type="text" name="term_4[]" value="150" class="form-control number-only"></td> 
 
<td class="ave" value="0"></td> 
 
</tr> 
 

 
<tr id="average"> 
 
<td colspan="3">Average</td><td colspan="2">0</td> <td colspan="2">0</td> <td colspan="2">0</td> <td colspan="2">0</td> 
 
</tr> 
 
</tbody> 
 
</table>