/Javascript/jQuery/How to calculate each row with on change table <td><input> jquery

How to calculate each row with on change table <td><input> jquery

How to calculate each row with on change table jquery

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
  <table>
    <thead>
      <tr>
        <th>Quantity</th>
        <th>Price</th>
        <th>Total</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td><input type="text" class="qty"></td>
        <td><input type="text" class="price"></td>
        <td><input type="text" class="total" disabled></td>
      </tr>
      <!-- ...and so on... -->
    </tbody>
  </table>
<script>
  (function() {
    "use strict";

    $("table").on("change", "input", function() {
      var row = $(this).closest("tr");
      var qty = parseFloat(row.find(".qty").val());
      var price = parseFloat(row.find(".price").val());
      var total = qty * price;
      row.find(".total").val(isNaN(total) ? "" : total);
    });
  })();
</script>
</body>
</html>

Source: stackoverflow.com

Similar codes

105 votes132 views6 answers
For each jquery
Javascript jQuery
11 votes122 views2 answers
Set select option as selected jquery
Javascript jQuery
0 vote120 views1 answer
Jquery if element is clicked
Javascript jQuery
2 votes116 views6 answers
Trigger keyup event jquery
Javascript jQuery
-1 vote195 views1 answer
Jquery dom traversal parent
Javascript jQuery
19 votes118 views4 answers
Get select option selected text jquery
Javascript jQuery
0 vote136 views1 answer
Remover clase jquery
Javascript jQuery
22 votes115 views2 answers
Jquery loop through each child element
Javascript jQuery
69 votes120 views3 answers
Jquery each array object
Javascript jQuery
57 votes119 views6 answers
Jquery append
Javascript jQuery