使用表格单元格值加上子总计和总计数进行计算

Question

我在这个问题上已经挣扎了很长时间。 （我在一年多前开始了一个帖子......然后由于失败而放弃了） 用Google搜索并在SO上搜索了一些代码，但在完成它时没有太多的快乐。

我有一个表，从php / sql填充。

在它上面会有

cost    qty1    qty2    qty3    Lineqty  Linecost

我需要lineqty中的qty1，qty2，qty3的总数，而linecost将是prod_cost * lineqty

这是我到目前为止的jQuery ......

$(document).ready(function() {
  $(".qty").each(function() {
    $(this).change(function() {
      calculateTotal($(this).parent().index());
    });
  });
});

function calculateTotal(index) {
  var total = 0;
  $('table tr td .row_total').filter(function() {
    if ($(this).index() == index) {
      total += parseFloat($(this).find('.qty').val()) || 0;
    }
  });
  $('table tr td.totalCol:eq(' + index + ')').html(total);
  calculateSum();
  calculateRowSum();
}

function calculateRowSum() {
  $('table tr:has(td .qty)').each(function() {

    var sum = 0;
    $(this).find('td').each(function() {
      sum += parseInt($(this).find('.qty').val()) || 0;
    });

    var costeach = 1.49;
    $(this).find('td').each(function() {
      costeach += parseFloat($(this).find('.prod_cost').val());
    });

    var rowsum = sum * costeach;
    $(this).find('td .row_total').html(sum);
    $(this).find('td .row_sum').html(rowsum);

  });
}

function calculateSum() {
  var sum = 0;
  $("td.row_total").each(function() {
    sum += parseFloat($(this).html()) || 0;
  });
  $("#sum").html(sum.toFixed(2));
}

这是输出表：

<table>
  <thead class="header">
    <tr>
      <th>Cost</th>
      <th>1.2 %</th>
      <th>1.8 %</th>
      <th>Tester</th>
      <th>2.4 %</th>
      <th>Line Qty</th>
      <th>Line Cost</th>
    </tr>
  </thead>
  <tbody>
    <tr class="Flavoured NM-Line Available liquidrow">
      <th class="prod_cost price">1.90</th>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input tabindex="-1" class="form-control" value="1" type="checkbox">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td><span class="row_total"></span>
        <span class="row_cost"></span></td>
    </tr>
    <tr class="Flavoured NM-Line Available liquidrow">
      <th class="prod_cost price">1.9</th>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input tabindex="-1" class="form-control" value="1" type="checkbox">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td><span class="row_total"></span>
        <span class="row_cost"></span></td>
    </tr>
    <tr class="Flavoured NM-Line Available liquidrow">
      <th class="prod_cost price">1.90</th>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input tabindex="-1" class="form-control" value="1" type="checkbox">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td><span class="row_total"></span>
        <span class="row_cost"></span></td>
    </tr>
    <tr class="Minty NM-Line New liquidrow">
      <th class="prod_cost price">1.9</th>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td>
        <input tabindex="-1" class="form-control" value="1" type="checkbox">
      </td>
      <td>
        <input min="1" step="1" class="qty form-control" type="number">
      </td>
      <td><span class="row_total"></span>
        <span class="row_cost"></span></td>
    </tr>
    <tr class="totalColumn">
      <td class="totalCol" align=right>Total:</td>
      <td class="totalCol" align=right></td>
      <td class="totalCol" align=right></td>
      <td class="totalCol" align=right></td>
      <td class="totalCol" align=right></td>
      <td class="totalCol" align=right></td>
      <td class="totalCol" align=right></td>
    </tr>
  </tbody>
</table>

我目前的jfiddle在这里： https://jsfiddle.net/o9cpb0fL/6/

感谢任何帮助。