Выполнить расчет в ячейке динамической таблицы HTML с помощью Jquery

Question 1

Я в основном выполняю вычисления в ячейке динамической таблицы, хочу изменить сумму значений ячейки всякий раз, когда значение ячейки изменяется пользователем

Я уже пробовал другой метод JQuery, но не получить то, что я хочу

<table class="table table-responsive table-hover table-bordered" id="tablefinaldata">
<thead>
    <tr>
        <td>
            <h5> Code</h5>
        </td>
        <td>
            <h5> Item</h5>
        </td>
        <td>
            <h5> Price</h5>
        </td>
        <td>
            <h5> Quantity</h5>
        </td>
        <td>
            <h5> Sub Total</h5>
        </td>
    </tr>
</thead>
<tbody id="tablefinalbody">

</tbody>

function CalSum ()
    {
        $("#setfinaldata #subtotal").each(function () {
            var row = $(this);
            var rowTotal = 0;
            $(this).find('th').each(function () {
                var th = $(this);
                if ($.isNumeric(th.text())) {
                    rowTotal += parseFloat(th.text());
                }
            });
            row.find('th:last').text(rowTotal);
        });
    }

javascript jquery html

-1

Haris Ali Khan

Answer

function CalSum() {
  var $trList = $("#tablefinalbody").find('tr');
  var rowTotal = new Array($trList.length);
  $trList.each(function() {
    var row = $(this);
    $(this).find('th').each(function(index) {
      var th = $(this);
      if ($.isNumeric(th.text())) {
        if (!rowTotal[index]) rowTotal[index] = 0
        rowTotal[index] += parseFloat(th.text());
      }
    });
  });

  $trList.last().children().each(function(index) {
    $(this).text(rowTotal[index])
  })
}
CalSum();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-responsive table-hover table-bordered" id="tablefinaldata">
  <thead>
    <tr>
      <td>
        <h5> Code</h5>
      </td>
      <td>
        <h5> Item</h5>
      </td>
      <td>
        <h5> Price</h5>
      </td>
      <td>
        <h5> Quantity</h5>
      </td>
      <td>
        <h5> Sub Total</h5>
      </td>
    </tr>
  </thead>
  <tbody id="tablefinalbody">
    <tr>
      <th>1</th>
      <th>2</th>
      <th>3</th>
      <th>4</th>
      <th>5</th>
    </tr>
    <tr>
      <th>123</th>
      <th>42</th>
      <th>53</th>
      <th>64</th>
      <th>234</th>
    </tr>
    <tr>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </tbody>
</table>

Question 2

function CalSum() {
  var $trList = $("#tablefinalbody").find('tr');
  var rowTotal = new Array($trList.length);
  $trList.each(function() {
    var row = $(this);
    $(this).find('th').each(function(index) {
      var th = $(this);
      if ($.isNumeric(th.text())) {
        if (!rowTotal[index]) rowTotal[index] = 0
        rowTotal[index] += parseFloat(th.text());
      }
    });
  });

  $trList.last().children().each(function(index) {
    $(this).text(rowTotal[index])
  })
}
CalSum();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-responsive table-hover table-bordered" id="tablefinaldata">
  <thead>
    <tr>
      <td>
        <h5> Code</h5>
      </td>
      <td>
        <h5> Item</h5>
      </td>
      <td>
        <h5> Price</h5>
      </td>
      <td>
        <h5> Quantity</h5>
      </td>
      <td>
        <h5> Sub Total</h5>
      </td>
    </tr>
  </thead>
  <tbody id="tablefinalbody">
    <tr>
      <th>1</th>
      <th>2</th>
      <th>3</th>
      <th>4</th>
      <th>5</th>
    </tr>
    <tr>
      <th>123</th>
      <th>42</th>
      <th>53</th>
      <th>64</th>
      <th>234</th>
    </tr>
    <tr>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </tbody>
</table>

Выполнить расчет в ячейке динамической таблицы HTML с помощью Jquery

1 ответ

Новые вопросы

javascript